仕事でjQueryでゴリゴリやることに限界というよりは疑問を感じるようになって、JavaScript MVCを調べるようになり、辿り着いたbackbone.js。Railsで使いたいなーと思ってbackbone-on-railsを使って、やってみようかと思ったけれど、まだbackbone.jsのことをよく理解してなかったので失敗。
んで、PHPでやっているプロジェクトがあるので、こっちはピュアなJavaScriptでやっているから、こっちでやってみることにした。

ちなみに4章以降はやっていません。（パラパラ読みはしてる）

お供にBACKBONE.JSガイドブックを持ってやっているのだけれど、俺のやり方が悪いのかもしれないんだけれど、なんかちょっと不親切だなーと思うところがあった。
Backbone.Routerを使ってルーターを定義し、Backbone.history.start();をしても動かなかった。
ルーターに設定されているURLにヒットすればBackbone.history.start()の戻り値はtrueになるはずだったのだが、ずっとfalseを返していた。

var Router = Backbone.Router.extend({
    routes: {
        'admin/index.html': 'admin_index'
    },
    admin_index: function() {
        var view = new AdminView();
        $('#content').html(view.render().el);
    }
});
$(function(){
    console.log(Backbone.history.start()); // false
});

ここで、オプションの{pushState: true}を追加したら、動き出した。

var Router = Backbone.Router.extend({
    routes: {
        'admin/index.html': 'admin_index'
    },
    admin_index: function() {
        var view = new AdminView();
        $('#content').html(view.render().el);
    }
});
$(function(){
    console.log(Backbone.history.start({pushState: true})); // true
});

オプションなので、デフォルトで動き出すのかと思ったら、そうでもないぽかった。start()したときにルーティングが合致すれば即座に実行されると書かれていたのだが、開始されなくてすごく参った。これは省略しても動く条件があるのか、それともpushStateじゃないと動かないのか？わからない…。（俺的にはpushStateじゃなくても動くと思ってたんだが）

また、アプリケーションの遷移をさせるのに、Backbone.history.navigate()を使う。これもまたやり方が悪かったのかもしれないが、動かなかった。p.83の「Aタグをクリックしたらnavigateする」というやつをそのまま書いたのだが…。

$(document).on('click', 'a[href][data-navigate]', function(e) {
    e.preventDefault();
    Backbone.history.navigate($(this).attr('href')); // 動かない…
});

正確には、navigateはされているんだけれど（ブラウザ上のURLは書き換えられてる）、triggerが発火しない。本では、「navigateで合致するルーティングが登録されていたら実行される。URLは遷移するが処理を実行したくない場合は第2引数に{trigger: false}を渡します。」とあった。処理をしたくない場合だけ書くのかと思っていたのだが…。サンプルもそうなっているし…。

ひょっとしてと思って、{trigger: true}にしたら、処理が実行された。

$(document).on('click', 'a[href][data-navigate]', function(e) {
    e.preventDefault();
    Backbone.history.navigate($(this).attr('href'), {trigger: true}); // 動いた！
});

これが通ったらあとは結構普通に書くことができたけれど、この2つにすげーハマった…。

また、本の中で紹介されているbackbone-formsというプラグイン。これを使ってみようと思って入れてみた。これはかなりよさそうで、bootstrapにも対応しているのでsimple-formいらなくなるんじゃね？くらいに思えたのだけれど、formのsubmitボタンが生成されない…。Backbone.Formのインスタンスでcommitメソッドを実行すると、保存されるみたいな感じだったけれど、そのタイミングがsubmitボタンじゃねーの！？と思うのだが…。生成の仕方があるのかもしれないが、ぐぐった感じだと無理矢理追加するというパターンばっかりでスマートなやつがなかった。submitボタンはフラグで置くかどうか選べるくらいあってもよいのになぁと思った。もっとBackbone.Viewに詳しくなってからのほうがいいかもしれないと思って、結局使うのをやめた。

あと、Backbone.Viewでつかうビューのテンプレートを、JavaScript内でゴリゴリとhtmlを書いているのが、なんとも…。まぁテンプレートはunderscore.jsの_.templateメソッドで作れるのであるが、これもまた面倒というか…。面倒くさがり過ぎかもしれんが。

Railsと組み合わせた場合、backbone-on-railsならばJSTのテンプレートが最初から使える状態になっていて、テンプレートはテンプレートでerbみたいに書けるので、いいと思うのだが、backbone.js単体でやろうと思うと結構手間な感じがする。

Backbone.Modelでデータを更新するときに使われるBackbone.syncの、デフォルトでアクセスするurlがRailsを想定したようなRESTful APIなので、本当にRailsを使うのであれば、すごく有用だと思う。だが、俺は今回PHPのCodeIgniterでやろうとしていた。CodeIgniterではライブラリを使えばRESTは実現できるっぽいんだけれど、Railsに比べるとものすごく手間がかかる（というかRailsが楽すぎる…）。

結論は、Backbone.jsはRailsもしくはYEOMANでないと面倒くさそう（YEOMANは使ったことないけれど）。

Backbone.jsのような大量のJavaScriptを作るような仕組みの場合は、4章で説明しているようなRequireJSとかGruntとかでごにょごにょやるようなのがないとキツい。Railsは勝手にコンパイルしてくれるので、相性が本当にいいんだろうと思う。

コードを書いていて、今回PHPで作っているツールはBackbone.jsを使わずにPHPでサクッと作ったほうがいいなと思った。

Backbone.js自体はすごくいい感じだと思う。よくわからないところもあるけど。Railsは本当にScaffoldした後はrootに指定したページからBackbone.jsで書き換えるだけでいいので、ほぼフロントエンドでの仕事になるんじゃないかと思うが、テンプレートもerbもしくはhamlみたいに書けるから、違和感もなさそうだし。

Railsプロジェクトでは積極的に使っていきたい印象。

本の感想としては、JavaScriptばっかに注力しすぎてる。前半からテンプレートをどういうふうにするかをもっと掘り下げてほしかった。
初心者向けではないのはわかるけれど、順序がなぁ…という感じ。