サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
今回は、javascriptのライブラリ「Underscore.js」の使い方をご紹介します。 ■ 公式 Underscore.js(http://underscorejs.org/) ■ 日本語訳 enja-oss/Underscore ・GitHub Underscore.jsとは Underscore.jsは、主にjavascriptの関数や配列、オブジェクトを扱う際に頻繁に発生する処理が、 100種類程度のメソッドとしてまとめられている軽量なライブラリです。 （投稿時の最新バージョンは1.5.2。圧縮版のサイズは4.9kb） リリースからは既に数年が経過しており、JavaScriptのフレームワークであるBackborn.jsで依存ファイルとして使用されていたり、 Backborn.jsとともにVersion 3.5以上のWordPressに同梱されていたりするようですので、
Backboneでシステムに組み込む際にはビューにイベントのトリガーとなるアクションを仕込みます。そのためビューの中には色々なコードが書かれることになり、結果として殆どの処理をビューが行う状態になってしまったりします。 それを上手に切り離せるかもしれない機能がBackboneUIです。BackboneでUIコンポーネントを提供するという面白いソフトウェアです。 BackboneUIの使い方 幾つかのコンポーネントをチェックしてみます。 ボタンとカレンダー。 チェックボックスに日付ピッカー、それにリンクも。 各種フォームのコンポーネントも入っています。 メニュー、プルダウンもあります。 ラジオグループ。 リストビュー。 テーブルビュー。 タブ。 例えばテキストフィールドを使う場合、次のようになります。 //create atext field to add newitems var
Marionette.jsのチュートリアルを書く。 特に、yeoman製のgenerator-marionetteを使って、railsみたいに、楽しながら、進めていく。 量が多くなったので、何度かに分けて書く。 この記事は、yeomanによる準備から、node+expressによるサーバー側まで。(baucis という楽チンな仕組みを使う) Marionette.jsとは？ この前作ったslideをご参考に。 introduction to Marionette.js (jscafe14) from Ryuma Tsukano インストール 以下のgenerator-marionetteのgithubのページを参照 https://github.com/mrichard/generator-marionette#install 特にハマる事は無い。多分ね。 project作成 proje
以下、Underscore.jsが1.3.3当時の情報です。template _.template(templateString, [data], [settings]) Underscore.js Utilitytemplate Backbone.jsを試すついでに、Underscore.jsについてるtemplateを試してみました。他のテンプレートライブラリ持ち込んでくるのも億劫だったので。 <script id="tmplString" type="text/template"> <h3>店舗情報</h3> <div id="store"> <p><a href="<%- data.store.url %>"><%- data.store.name %></a></p> <img src="<%- data.store.image %>" alt="店舗写真" /> <dl>
今回はBackbone.jsを使ってフォームから追加し、削除できるリストを作ってみたいと思います。デザインは前回同様TwitterBootstrapで作成しました。htmlはこちら！ <div id="ui-list"> <div class="list-controls"> <form> <div class="input-append"> <input type="text" placeholder="Please type something" /> <input type="submit" class="btn" value="Add" /> </div> </form> </div> <div class="list-items"> <ul> <li class="list-item" data-cid="c1"> <a href="#" class="close">×</a
object.once(events, callback, [context]) object.listenTo(other, event, callback) object.stopListening([other], [event], [callback]) Backbone.Model Backbone.Model.extend([properties], [classProperties]) Backbone.Model を継承した新しいモデルを作ります。 properties インスタンスメンバを定義します。 var User = Backbone.Model.extend({ say: function () { console.log("Hello."); } }); var user = new User(); user.say(); //-> Hello. classPr
1リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
