Rails4でプロジェクトの最初にSlimとBootstrapを導入する

Railsでプロジェクトを開始する際にBootstrap+Slimを導入してみたのでとりあえずメモしときます。

Slim

まずSlimってのは

• Rubyのテンプレートエンジンです。
• 高速, 軽量です。
• コード量が減る。見やすい。美しい。

Slim is a template language whose goal is reduce the syntax to the >essential parts without becoming cryptic.

スリムは可読性を確保しつつ、基本的パーツのコード量を減らすことを目的に作られたテンプレート言語である。

本家より。

RailsにSlimをいれる

gem 'slim-rails'

でbundle installします。

config/application.rb

class Application < Rails::Application
  config.generators do |g|
    g.template_engine :slim
  end
end

これで準備OKです。rails generateとかするとslimで生成されます。

Bootstrap

Bootstrapはまあ皆様ご存知だと思います。私みたいにデザインセンス無い方はよくお世話になっていると思います。

準備

まあ、例によってGemfileに

# Bootstrap
gem 'less-rails'
gem 'therubyracer'
gem 'twitter-bootstrap-rails', '~> 2.2.8'
gem 'font-awesome-rails'
gem 'bootstrap-sass', '2.3.2.0'

bootstrap3の場合は

gem 'twitter-bootstrap-rails', :git => 'git://github.com/seyhunak/twitter-bootstrap-rails.git', :branch => "bootstrap3"

みたいです。

bundle install

bootstrapのファイル郡作成

bundle exec rails g bootstrap:install less

テンプレート作成

bundle exec rails g bootstrap:layout application fluid

(fluid・・・レスポンシブ対応)

これでviews/layouts/にapplication.html.slimができるかなと思います。

参考にさせていただきましたサイト様

速習テンプレートSlim(HTML作成編) - Qiita
Rails - Rubyのテンプレートエンジンをerbからslimに変更する際に変えた事 - Qiita
Slim - A Fast, Lightweight Template Engine for Ruby
slim/README.jp.md at master · slim-template/slim · GitHub
RailsでTwitter Bootstrapを使う - Qiita
seyhunak/twitter-bootstrap-rails · GitHub