Backbone UI – Webアプリケーション開発に良さそうなBackbone用UIコンポーネント
Backboneでシステムに組み込む際にはビューにイベントのトリガーとなるアクションを仕込みます。そのためビューの中には色々なコードが書かれることになり、結果として殆どの処理をビューが行う状態になってしまったりします。 それを上手に切り離せるかもしれない機能がBackbone UIです。BackboneでUIコンポーネントを提供するという面白いソフトウェアです。
Backbone UIの使い方
幾つかのコンポーネントをチェックしてみます。
例えばテキストフィールドを使う場合、次のようになります。
// create a text field to add new items
var newItem = new Backbone.Model;
var field = new Backbone.UI.TextField({
model: newItem,
content: 'title',
placeholder: 'add a new item',
onKeyPress: function(e) {
if (e.keyCode == 13) {
list.options.model.add(newItem.clone());
newItem.set({
title: undefined
});
}
}
}).render();
テキストフィールドの中で、onKeyPressを定義すれば、実際に入力された際にこのイベントが呼ばれるようになります。ビューの中でkeypressなどを定義する必要はありません。イベントとビューが切り離されるとコードの見通しが良くなるのではないでしょうか。特にイベントのハンドリングが多い、Webアプリケーション開発に良さそうです。
Backbone UIはJavaScript製のオープンソース・ソフトウェア(MIT License)です。