皆さん、こんにちは。id:KenichiroMurataです。
今回はKnowledge Noteにて連載させて頂いていた 「試して学ぶBackbone.js入門」が全５回分公開されたため、そのまとめをしたいと思います。
記事のコンセプト
タイトルに含めた通り、実際にコードを書いて試してみることでBackbone.jsの理解を深めることを一番の目的としています。
なので、ぜひ実際に記事の中に出てくるコードを書いて、動かして、コンソールのログや動作を確認することをおススメします。
各記事の概要
第１回 試して学ぶBackbone.js入門
Backbone.jsの概要から、インストール方法、Model、Collectionの基本を説明しています。
目次
- はじめに
- セットアップ
- Modelの基本
- Collectionの基本
- Collectionの便利な関数
第２回 試して学ぶBackbone.js入門2
Backbone.jsの優れた機能である非同期RESTful JSONインタフェースによる永続化について説明しています。また、余談として、jQueryのDeferredオブジェクトを使った非同期リクエストのフローコントロールについても紹介しています。
第３回 試して学ぶBackbone.js入門3
Backbone.jsによるアプリケーションのアーキテクチャを決定づけるBackbone.Eventsについて説明しています。
目次
- はじめに
- Backbone.Events
- イベントの監視設定／解除
- 実際にイベントを監視してみる（add, change, remove, reset, sort）
- 実際にイベントを監視してみる（request, sync, destroy, invalid）
- optionsハッシュのsilent:trueとwait:trueについて
第４回 試して学ぶBackbone.js入門4
Backbone.jsのアプリケーションの画面表示周りを制御するBackbone.View（以降、View）について、Memoアプリケーションの作成を実例にして説明しています。
目次
- はじめに
- Backbone.View
- Viewのプロパティとメソッド
- 今回の画面のHTML
- AppViewの定義
- ListViewの定義
- ItemViewの定義
- まとめ
第５回 試して学ぶBackbone.js入門5
Backbone.jsの最終回の今回は、Backbone.Router（以降、Router）について、Memoアプリケーションに改良を加える形で説明しています。
目次
- はじめに
- Backbone.Router
- Routerの定義
- navigateメソッドによるURLの変更
- pushStateを有効にする
- pushStateを利用する際の注意点
- まとめ
この先の公開予定について
Backbone.jsの入門としてはここで紹介した全５回で記事は終了になります。今後まだいくつか記事が公開される予定なのですが、その中でも第４回から取り上げているMemoアプリケーションを題材として、以下のようなものがあります。
- jQuery Mobileを使ってモバイルアプリケーションにしたもの
- CoffeeScriptによって書き直したもの
- LocalStorageを使って書いたもの
- Application Cacheを導入したもの
- バックエンドをBaaSであるParseによって書き直したもの
今回のBackbone.jsの記事と比較しながら読むと理解がより深まると思いますので、ぜひご期待ください！
