Blogブログ

Category: backbone.js

Backbone.jsでAPIに渡すときのメモ。

Backbone.jsでAPIに渡すときのメモ。 Backbone.sync とは Backbone.sync とはBackboneがモデルからデータを取得したり保存したりする際に使う関数。 デフォルトでは、jQUery.ajaxを使ってRESTful JSON リクエストを送信し、jqXHRを受け取る。 また、オーバーライドも可能。 —————————- RESTful とは ウェブサービスのひとつの形 ・明示的に HTTP メソッドを使う ・ステートレスにする ・ディレクトリー構造に似た URI を公開する ・XML、JSON (JavaScript Object Notation) のいずれか、またはその両方を転送する jqXHR とは XMLHttpRequestオブジェクトを一般化し、クロスブラウザ対応を行ったjQuery独自のオブジェクト。 —————————- sync()の基本形 sync(method, model, [options]) method – the CRUD method ("create", "read", "update", or "delete") model – the model to be saved (or collection to be read) […]

Backbone で Handlebars

Backbone.jsのテンプレートにHandlebarを使います。 ただ、Handlebarで問題となるのがコンパイル前の遅さ。 それを補うために、Gruntを使ってプリコンパイルする手法があります。 そのためには.hbsという拡張子でテンプレートファイルを作成して、この内容をgrantを使いtemplate.jsに随時反映させるのが便利です。 先ずはGruntの設定。 Gruntについてはこちら。 Grunt.js コマンドを開き、作業ディレクトリまで進みます。 cd /yourapps/dir/ イニシャライズを行います。 npm init これでpackage.jsonが生成されました。 次にgruntをインストールします。 npm install grunt –save-dev これでnode_modulesというフォルダが生成されました。 次に、プラグインを入れてみます。 package.jsonを編集します。 プラグインはgrunt-contribを使ってみます。 grunt-contribについての詳しい説明はこちら。 grunt-contrib 今回はhandlebarの自動プリコンパイルが目的ですが、それ以外にもcssやjsの圧縮など、便利な機能がたくさんあります。 少し時間がかかるかも知れませんが、一気に入れるには以下のコマンドを実行します。 npm install grunt-contrib –save-dev 個別に入れる場合は、 npm install grunt-contrib-handlebars –save-dev や、 npm install grunt-contrib-watch –save-dev このようにします。 使いなれて、好きなものだけ入れるためには、package.jsonを使うのが便利です。 一度、node_modulesのフォルダを削除します。 そして、devDependencies の項目に、 “devDependencies”: { “grunt”: “~0.4.1”, “grunt-contrib-watch”: “~0.3.1”, “grunt-contrib-cssmin”: “~0.4.2” } […]