今回はフルスタックなJavaScriptライブラリ「Angular」と、コンセプトが反対の「Backbone.js」を紹介しよう。

 Backbone.jsは、Angularと同じく「MV*」をサポートするJavaScriptフレームワークの一つだ。ただし名前の通り、骨組みしかない。

 簡単に言うと、「Model、View、そしてRouterを簡単にWebアプリケーションに組み込むことに特化したJavaScriptライブラリ」となる。もちろん、ほかにも多様な機能を持つが、他のJavaScriptライブラリと組み合わせて使うことが基本となっている。

ほかのライブラリの力を借りる

 Backbone.jsを使うための準備はいたって簡単だ。公式WebサイトからBackbone.jsをダウンロードして、HTMLにscript要素で組み込むだけだ。ただし前述の通り、いくつか他のJavaScriptライブラリの力を借りる必要がある。

 まず、主にViewでテンプレートを処理するために「Underscore.js」が必要だ。「jQuery」も欠かせない。jQueryは必須ではないが、Backbone.jsはjQueryと部分的に連携しているため、組み合わせるほうが便利になる。jQueryに慣れ親しんでいるなら、Backbone.jsの導入は比較的容易だろう。

 ではBackbone.jsの仕組みを解説しよう。まずはModelとViewの関係性だ。ユーザーが何かしらの入力を行うと、Viewがそれをキャッチし、Modelに伝える。Modelはそのアクションに対応した処理を行う。データベース(DB)と連携することも可能だ。

 ここで言うDBは、単にJavaScript上の変数のケースもあれば、ローカルストレージに保存する場合もある。クラウドと同期する場合もあるだろう。

[画像のクリックで拡大表示]

この先は会員の登録が必要です。今なら有料会員(月額プラン)登録で6月末まで無料!

日経 xTECHには有料記事(有料会員向けまたは定期購読者向け)、無料記事(登録会員向け)、フリー記事(誰でも閲覧可能)があります。有料記事でも、登録会員向け配信期間は登録会員への登録が必要な場合があります。有料会員と登録会員に関するFAQはこちら