Rails 3.1 の機能がもう試せるらしいので、下記のエントリを参考にしつつ試してみました。
How to Play with Rails 3.1, CoffeeScript and All That Jazz Right Now
edge な rails アプリの作成
rvm でインストールしたての(gemのはいってない) Ruby 1.9.2 を使って試しました。 まずは github から rails のリポジトリを取得して、ワーキングディレクトリに含まれる rails コマンドを--edgeオプションを付けて実行します。--edge オプションを指定すると、rails の github リポジトリ上の最新のコードから Rails アプリを作成します。
cd ~/work/github/ git clone git://github.com/rails/rails.git ~/work/github/rails/bin/rails new yourapp --edge
そしたらエラー。
You don't have i18n installed in your application. Please add it to your Gemfile and run bundle install
これからrailsアプリ作るのに Gemfile も bundle install もやりようがないので、普通に gem install で i18n をインストール
gem install i18n
でもう一度。でもまだダメ
Thor is not available. If you ran this command from a git checkout of Rails, please make sure thor is installed, and run this command as `ruby /Users/maeshima/work/github/rails/bin/rails yourapp --edge --dev`
今度はthorが入っていないのが原因。
gem install thor
でもう一度・・・まだダメ。
/Users/maeshima/.rvm/gems/ruby-1.9.2-p180@global/gems/bundler-1.0.0.rc.5/lib/bundler/ui.rb:46:in `<class:UI>': uninitialized constant Gem::SilentUI (NameError)
今度は bundler まわりでエラー。bundler が古いので1.0.12にアップデート。
gem update bundler
これでようやく edge な rails アプリが作れました。--edge オプションの指定により、自動で github からもりもり edge な gem がインストールされていきます。
edge な rails を眺める
Rails 3.1 から始まる CoffeeScript と sass 対応のために、javascript と css を置くディレクトリが変わっていました。それぞれ js 用には
- app/assets/javascripts
- vendor/assets/javascripts
css用には
- app/assets/stylesheets
- vendor/assets/stylesheets
というディレクトリが新しく作られています。デフォルトでは
- app/assets/javascripts/application.js
- vendor/assets/javascripts/jquery.js
- vendor/assets/javascripts/jquery_ujs.js
のようなファイルが用意されている*1ことから推測すると、
- app/assets/javascripts
- ユーザが編集したjsファイルを置く
- vendor/assets/javascripts
- ライブラリ系のjsファイルを置く
というようなディレクトリの使い分けを意識しているのではないでしょうか。
sprockets
上記で書いたような js や css まわりの変更は、Gemfileで新しく指定されるようになった sprocketsというライブラリが関係しているようです。ちなみに、sprocketは「自転車のチェーンとかみ合う鎖車」という意味です。
sprocketsは、下記の機能を持ったrackベースのプラグインのようです。
- 複数のjsファイルやcssファイルを一つに結合する機能
- CoffeeScript, Less, Sass, SCSSをコンパイル
- ドキュメントルート以外に置かれているファイルを配信する
sprockets の機能 js 編
app/assets/javascripts/application.js には下記のようなコードが書かれていました。
//= require jquery //= require jquery_ujs //= require_tree .
この "//=" というのは、sprockets のディレクティブ宣言用のおまじないです。続く require ディレクティブによって、結合する javascript の名前を指定しています。require ディレクティブが探すのは下記の二箇所なようです。
- app/assets/javascripts
- vendor/assets/javascripts
require_tree ディレクティブは、指定したディレクトリのファイルを全部 require するというディレクティブです。指定したディレクトリの下の階層のディレクトリも再帰的に読み込みます。
view ファイルで
<%= javascript_include_tag "application" %>
のようにすると、/assets/application.js を読み込みます。/assets/application.js へのリクエストが投げられると、
- app/assets/javascripts/application.js が読まれる
- ディレクティブが解釈される
- vendor/assets/javascripts/jquery.js, vendor/assets/javascripts/jquery_ujs.js, app/assets/javascripts 配下の他のjsファイルが(もしあれば)連結されて返される
という流れで、一つの /assets/application.js ファイルの中に複数の js が詰め込まれる形でレスポンスが返ります。
CoffeeScriptも簡単に扱うことが出来ます。.coffee という拡張子で CoffeeScript を書いて require すると、自動で js にコンパイルされて他の js ファイルと同じように連結されます。手動でコンパイルしなくていいのは楽ですね。
sprockets の機能 css 編
基本的にjsとぼぼ同じ感じです。sassを使いたい場合は.scssという拡張子を付けると、CoffeeScriptと同じく自動でコンパイルされます。これも便利ですね。
感想
3.1になってますます綺麗なコードでアプリを書けるようになったように思います。ただ、初心者への敷居もどんどん上がっているような気も。
あとsprocketsはまだ便利機能を隠している気がするので、また別の機会に調べようと思います。
