Rails 4でHeroku Pushまでの詳細手順 [haml/bootstrap 3.0/postgresql or MySQL]

短時間でプロトタイプを制作する場合には、インフラ構築のコストが低いHerokuはベストな選択肢のひとつです。ということで、Ruby 2.1とRails 4.0のプロジェクトをHerokuにPushするまでの手順を書いておきます。DBはPostgreSQL or MySQL、テンプレートエンジンはHaml、CSSフレームワークはBootstrap 3.0を使います。

この記事の一連のコマンドを半自動化できる『Application Template』を作りました。詳しくは『Rails4 x herokuアプリを5分でスタートできるapplication template作ってみた！』をご参照ください！

(03/21 09:40) かなりの分量ですので、タイトルを「簡単手順 => 詳細手順」に変更

🎉 手順詳細

Ruby 2.1をインストール

Ruby 2.0 => 2.1は今のところ問題もなく使えています。ということでRVM or Rbenvで2.1をインストールしてプロジェクトを開始するのをお勧めします。ちなみにHerokuは12/25(Ruby 2.1リリース日)から2.1対応しています。

Heroku Toolbeltをインストール

Herokuを使う上で欠かせない、コマンドラインツールのHeroku Toolbeltをサイトからダウンロードしてインストールしてください。

PostgreSQL/pgの導入

Mac or CentOS限定ですが、Mac MountainLion/CentOS 6.4へのPostgreSQL 9.2の導入手順をよかったらご参考いただきつつ、PostgreSQLおよびgem pgをインストールしてください。MySQLの場合はここは読み飛ばしてください。

Railsプロジェクト作成

Railsの新規プロジェクトを作成。

# Heroku標準のPosgreSQLを使う場合
rails new test-app --database=postgresql --skip-test-unit --skip-bundle

# MySQLを使う場合
rails new test-app --database=mysql --skip-test-unit --skip-bundle

Rails用の.gitignoreを作成します。.gitignoreを生成するgitignore-boilerplatesを使う場合はこちら。(Macでのインストール方法は、brew install giboを実行)

# gibo --listでパラメータ確認可能
gibo OSX Ruby Rails JetBrains SASS SublimeText > .gitignore

gitignore-boilerplatesを使わないで、GitHubから.gitignoreのテンプレートをダウンロードする場合はこちら。

wget https://raw.github.com/github/gitignore/master/Rails.gitignore;mv Rails.gitignore .gitignore

.gitignoreから次のコードを削除。

config/initializers/secret_token.rb

Gitリポジトリ作成を作成します。

git init
git add -A
git commit -m "new project"

Gemfileの設定

Gemfileを編集して、bundle installでGemをインストール。

(gemは適宜カスタマイズしてください)

ruby '2.1.0'

# Bower Manager => https://rails-assets.org/
source 'https://rails-assets.org'

# turbolinks support
gem 'jquery-turbolinks'

# Source Map
gem 'coffee-rails-source-maps'
gem 'sass-rails-source-maps'

# See https://github.com/sstephenson/execjs#readme for more supported runtimes
gem 'therubyracer', platforms: :ruby

# CSS Support
gem 'less-rails'

# App Server
gem 'puma'

# Presenter Layer
gem 'draper'

# Haml
gem 'haml-rails'

# Assets log cleaner
gem 'quiet_assets'

# Form Builders
gem 'simple_form'

# # Process Management
gem 'foreman'

# HTML5 Validator
gem 'html5_validators'

# PG/MySQL Log Formatter
gem 'rails-flog'

# Migration Helper
gem 'migrant'

# Pagenation
gem 'kaminari'

# NewRelic
gem 'newrelic_rpm'

# Airbrake
gem 'airbrake'

# HTML Parser
gem 'nokogiri'

# App configuration
gem 'figaro'

# Rack Profiler
gem 'rack-mini-profiler'

# Hash extensions
gem 'hashie'

group :development do
  # Converter erb => haml
  gem 'erb2haml'
end

group :development, :test do
  # Rails application preloader
  gem 'spring'

  # Railsコンソールの多機能版
  gem 'pry-rails'

  # pryの入力に色付け
  gem 'pry-coolline'

  # デバッカー
  gem 'pry-byebug'

  # Pryでの便利コマンド
  gem 'pry-doc'

  # PryでのSQLの結果を綺麗に表示
  gem 'hirb'
  gem 'hirb-unicode'

  # pryの色付けをしてくれる
  gem 'awesome_print'

  # Rspec
  gem 'rspec-rails'
  gem 'rake_shared_context'

  # fixtureの代わり
  gem "factory_girl_rails"

  # テスト環境のテーブルをきれいにする
  gem 'database_rewinder'

  # Guard
  gem 'guard-rspec'
  gem 'guard-spring'
end

group :production, :staging do
  # ログ保存先変更、静的アセット Heroku 向けに調整
  gem 'rails_12factor'
end

Railsの基本的な設定

config/application.rbの中にあるYourAppName::Application.configure内に以下を追加。

# Set timezone
config.time_zone = 'Tokyo'
config.active_record.default_timezone = :local

# 日本語化
I18n.enforce_available_locales = true
config.i18n.load_path += Dir[Rails.root.join('config', 'locales', '**', '*.{rb,yml}').to_s]
config.i18n.default_locale = :ja

# generatorの設定
config.generators do |g|
  g.orm :active_record
  g.template_engine :haml
  g.test_framework  :rspec, :fixture => true
  g.fixture_replacement :factory_girl, :dir => "spec/factories"
  g.view_specs false
  g.controller_specs false
  g.routing_specs false
  g.helper_specs false
  g.request_specs false
  g.assets false
  g.helper false
end

# libファイルの自動読み込み
config.autoload_paths += %W(#{config.root}/lib)
config.autoload_paths += Dir["#{config.root}/lib/**/"]

続いてsecret_tokenの設定。/config/initializers/secret_token.rbのsecret_key_baseを設定。sometokenのところにはもともとのトークンをセット。

TestApp::Application.config.secret_key_base = ENV['SECRET_KEY_BASE'] || 'sometoken'

Railsの日本語化ファイルを設定する。

wget https://raw.github.com/svenfuchs/rails-i18n/master/rails/locale/ja.yml -P config/locales/

application.jsに以下を追加してturbolinksで$(document).ready()のイベントが発行するように修正。

//= require jquery
//= require jquery.turbolinks
//= require turbolinks

Hamlへの変換

ViewのERBをhamlに変換。

# erb => hamlに変換。erbは削除
rake haml:replace_erbs

# erb => hamlに変換。erbは残す
rake haml:convert_erbs

Bootstrap/Bootswach/Font-Awaresomeを使う手順

Bootstrap CDNから使いたい『Bootstrap/Bootswach/Font-Awaresome』の種類を選択。
app/view/layouts/application.html.hamlに次のように記述。
(バージョンや書き方がよく変わるのでBootstrap CDN側を参照のこと)

%script{:src=>'//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js'}
%link{:href=>'//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css', :rel=>'stylesheet'}
%link{:href=>'//netdna.bootstrapcdn.com/bootswatch/3.0.3/simplex/bootstrap.min.css', :rel=>'stylesheet'}

simple_formの設定

simple formの初期設定(bootstrap対応)。

rails g simple_form:install --bootstrap

figaroの設定

Herokuの定数管理にお勧めのGem「laserlemon/figaro」です。Figaroの設定ファイルの生成。

rails g figaro:install

kaminariの設定

Railsのページネーションgem「kaminari」の設定ファイルを生成。

rails g kaminari:config
rails g kaminari:views  bootstrap

Databaseの設定

次にDB関連の設定。まずは、database.ymlの修正。developmentとtestの設定に以下を追加。

host: localhost

PostgreSQLのユーザーを作成。途中でパスワードを聞かれますが、開発/テスト環境の場合は入力せずにENTERだけでOKと思います。

createuser test-app -s

続いてdevelopmentのDBの作成。(testも一緒に作成されます)

bundle exec rake RAILS_ENV=development db:create

Pumaの設定

さらにアプリケーションサーバのpumaを設定。以前はunicornをつかっていましたが、Herokuでasset compile時に極まれによくわからないエラーが発生してしまうので、解決できずに乗り換えました。herokuの時にはpumaも性能よさそうですよ。

ということでconfig/initializers/after_initialize.rbを作成して、次の内容を記述。

Rails.application.config.after_initialize do
  ActiveRecord::Base.connection_pool.disconnect!

  ActiveSupport.on_load(:active_record) do
    if Rails.application.config.database_configuration
      config = Rails.application.config.database_configuration[Rails.env]
      config['reaping_frequency'] = ENV['DB_REAP_FREQ'] || 10 # seconds
      config['pool']              = ENV['DB_POOL']      || 5
      ActiveRecord::Base.establish_connection(config)
    end
  end
end

Procfileに次のコードを追加(or新規作成)。

web: bundle exec puma -t ${PUMA_MIN_THREADS:-8}:${PUMA_MAX_THREADS:-12} -w ${PUMA_WORKERS:-2} -p $PORT -e ${RACK_ENV:-development}

pumaの起動。

foreman start

http://0.0.0.0:5000をブラウザで開いてエラーが出ていないことを確認。

Rails 4 初期画面

RSpec/Spring/Guardの設定

RSpecのひな型の作成。

rails g rspec:install

.RSpecにはRSpecコマンドの引数を記述できます。次のとおり編集。
(詳細はRSpec –helpを参照)

echo '--color --drb -f d' > .rspec

spec/spec_helper.rbに以下を追加。

# 追加
require 'factory_girl_rails'

# 削除
require 'rspec/autorun'

# RSpec.configure do |config|の中に追加
config.before :suite do
  DatabaseRewinder.clean_all
end

config.after :each do
  DatabaseRewinder.clean
end

config.before :all do
  FactoryGirl.reload
end

config.include FactoryGirl::Syntax::Methods

続いてSpringのbinファイルを追加。

wget https://raw.github.com/jonleighton/spring/master/bin/spring -P bin/
sudo chmod a+x bin/spring

さらにGuardの設定ファイルを追加。

bundle exec guard init

生成されたGuardfileの内容を変更。

guard :rspec do
# ↓ 以下に変更
guard :rspec, cmd: 'spring rspec -f doc' do

scaffold表示まで

scaffoldの作成してビューを追加。

rails g scaffold product name price:integer

config/routes.rbにて、ルートアクセス設定を追加。

root :to => 'products#index'

DBのマイグレーション。

bundle exec Rake RAILS_ENV=development db:migrate

http://0.0.0.0:5000でscaffordしたビューが見れることをブラウザで確認。

Herokuのアプリを作成

Herokuにアプリを登録。

heroku create test-app

secret_tokenを生成

次のコマンドを実行して、Herokuにsecret_tokenを生成してセット。

heroku config:set SECRET_KEY_BASE=`rake secret`

タイムゾーンの設定

HerokuのタイムゾーンをTokyoに設定。

heroku config:add TZ=Asia/Tokyo

NewRelicの導入

Herokuのアイドリング防止とエラー検出などを兼ねてNewRelicを導入。

まずは無料プランでセットアップ。

heroku addons:add newrelic

次のコマンドでブラウザが起動してNewRelicの管理画面が開きます。

heroku addons:open newrelic

『Get Started』ボタン => 2の『Generate Licence Key』ボタン => 4の『Download the newrelic.yml file』ボタンを実行。ymlファイルを/config/に置きます。

/config/newrelic.ymlの中でapplication名を変更。

(test-appは自分のアプリケーション名に変更してください)

app_name: test-app

あとはdeployして5分後くらいに、Heroku addons:open newrelicを実行すればNew Relic上でHerokuのパフォーマンスをチェックできます。

でモニタリング画面が表示されるようになったら、『Applications』=>『test-app』=>『Settings』=>『Availability Monitoring』=>『URL to ping』のフォームにhttp://test-app.herokuapp.com/などHerokuで発行されたURLを記入して『Save to Change』ボタンを実行。

これで定期的にデフォルトでは1分おきにURLの死活監視をしてくれるようになるっぽいです！

Logentriesの導入

『Logentries』はログの保存や検索をサポートしてくれるサービスです。ログの中で特定のキーワードがあった場合にはエラーをメールしてくれます。Herokuの場合は致命的なエラーのキーワードがあらかじめ登録されているので、簡単にスタートできます。

heroku addons:add logentries

MySQLを使う場合

ここからはMySQLを使う場合限定です。まずはHerokuアドオンのClearDBをアドオンを追加。

heroku addons:add cleardb:ignite

次のコマンドを実行すると、CLEARDB_DATABASE_URLの設定情報が見えます。

heroku config | grep CLEARDB_DATABASE_URL
#=> CLEARDB_DATABASE_URL:        mysql://xxxx

このMySQL://xxxx以下をHerokuのDATABASE_URLにセット。

アダプタはmysql2にするように注意が必要。

heroku config:set  DATABASE_URL='mysql2 xxx' --app mimimiru-wh

HerokuへのPush

HerokuへのPushを行う前に、Gitに最新のコードをコミット。

git add . -A
git commit -m "add scaffold"

いよいよ、HerokuへのPush。

git push heroku master

あとはmigrationの実行。

heroku run rake db:migrate

次のコマンドを実行するとブラウザが起動するので確認。

heroku open

🏀 補足bundle execの省略

rbenv環境で、「rbenv-binstubs」を使うと、bundle execを省略できます。bundle install(bundle)の際に次のコマンドを入力してください。

bundle install --binstubs=.bundle/bin

🐝 Heroku両記事まとめ

herokuのDBにローカルのrailsアプリケーションからアクセス

AnosideをさくらのVPSからHerokuに移した話

SidekiqやMandrill、MySQLのデータをPostgreSQLのデータにコンバートする方法などが書かれています。

🐞 個人で使えそうなテック系サービス

kimono

Webサイトの特定箇所をWeb APIライクにJSON形式で取得できるサービス。

RSS-to-Email | MailChimp

RSSからメールを自動生成してくれるサービス・メルマガが充実している海外ならでは！

🎃 おもしろそうなGem

Railsなプロジェクトで利用している便利なGem一覧 - TIM Labs

モダンなRubyGemが数多くあります。Active Recordを簡単に書くことができる「Squeel」や「awesome_nested_fields」とか、これから試してみたい！

😼 参考リンク

@yoneappさんにconfig.serve_static_assets = trueを使わない方がいいよとドバイスをいただきました。助かりました。ありがとうございます！　＾＾

Ruby on Rails 4への移行でハマったポイント - Qiita [キータ]

Rails使いよspork, zeusからspringへ！ | Act as Professional - hiroki.jp

ruby on rails - Heroku Config Secret Key Base Error - Stack Overflow

Rails4をHerokuに(クラウドに一歩一歩近づく) - 五十の手習い日記

Rails4時代の高速テスト環境 Rspec+Guard+FactoryGirl+Spring[NEW!] - Qiita [キータ]

Herokuで強制的にdb:migrateをやり直す。 - このブログは証明できない。

Herokuにmaster以外のブランチをデプロイする方法 stackoverflow

Ruby 2.0.0-p247 + Rails 4.0.0 + minimum-omniauth-scaffold - Qiita [キータ]

Pete : Avoid Heroku idling with New Relic pings

Getting Started with Rails 4.x on Heroku | Heroku Dev Center

Heroku+Rails4+Devise+MySQL+Redis - 成らぬは人の為さぬなりけり

rails 4 enabled rails to serve static assets: is it correct? (on heroku) - Stack Overflow

Code from the sideline — Rails Quick Tip: Set a secret token for Heroku deploy

🐹 変更来歴

(13/09/29 20:25) rails_config/simple_formを追加

(13/09/30 05:20) 記述ミスの修正、おまけの追加

(13/12/01 12:50) postgresql用のユーザー作成の手順を追記、gem『rails_12factor』を追加

(13/12/03 21:45) Herokuにマスタ以外のブランチをデプロイする方法を追加

(13/12/05 08:55) Herokuタイムゾーン設定を追加、ERB=>hamlへの変換を追加

(13/12/06 20:45) Herokuへの環境変数の設定と確認

(13/12/23 12:05) config.serve_static_assets = falseを削除

(13/12/23 15:20) rails-assetsを追加

(13/12/28 10:10) newrelicの記述を追加

(14/01/01 16:05) guard/spring/kaminari/figaro/pumaの設定を追加、unicorn、.Ruby-versionを削除

(14/01/03 23:55) Application Templateへのリンクを追加

(14/02/02 20:55) Heroku両記事まとめを追加

(14/03/21 09:40) かなりの分量ですので、タイトルを「簡単手順 => 詳細手順」に変更

🖥 VULTRおすすめ

「VULTR」はVPSサーバのサービスです。日本にリージョンがあり、最安は512MBで2.5ドル/月($0.004/時間)で借りることができます。4GBメモリでも月20ドルです。最近はVULTRのヘビーユーザーになので、「ここ」から会員登録してもらえるとサービス開発が捗ります！

酒と泪とRubyとRailsと