Ember.js を Middleman から簡単に使うために ember-middleman を作りました

今巷で人気の Ember.js を Middleman で簡単に使うために ember-middleman という gem を作りました。

どんなことができるか、簡単にご紹介します。

gem によるライブラリの管理

Ember.js とそれが依存する Handlebars を gem で管理できるようになります。

# Gemfile

gem 'ember-source', '1.0.0.rc5'

これで、Asset pipeline のパスに Ember.js と Handlebars が追加されます。

//= require handlebars
//= require ember

Ember.js の頻繁なアップデートに対応するのが楽になります。

source/javascripts/templates 以下に handlebars でファイルを作成することができるようになります。

例えば、source/javascripts/templates/ok_button.js.handlebars というファイル名で以下の内容を保存したとします。

<div>
  <button {{action someAction}}>OK</button>
</div>

すると、JavaScript の中からは、 Ember.TEMPLATES['ok_button'] という名前でコンパイル済のテンプレートにアクセスできます。

Ember の view に対しても、 templateName: 'ok_button' という設定を行うことが可能になります。

これで、テンプレートファイルを html の中に埋め込まなくてよくなるのでメンテナンスしやすくなります。

Ember.js で使うであろうファイル/ディレクトリ群を自動生成することができます。

準備のために、以下の Gemfile を用意します:

# Gemfile
source 'https://rubygems.org'

gem 'middleman'
gem 'ember-middleman'

この状態で、以下のコマンドを入力します:

$ bundle exec middleman init . --template=ember

これでテンプレートが自動生成されます。

プロジェクト作成の際の手間が減ります。

使い方はいたってシンプルです。 middleman 用の Gemfile と confing.rb に以下の一行を追加するだけです:

# Gemfile
gem 'ember-middleman'

# config.rb
activate :ember

以上、ember-middleman のご紹介でした。

具体的に ember-middleman を利用しているプロジェクトはこちらにあるので、使い方に迷った方はご参照くださいませ。

Ember.js + Middleman の組み合わせで開発をしたいと思った方は選択肢のひとつに加えていただけると幸いです:D