Ruby on Rails チュートリアル第3章をやってみて

ほぼ静的なページの作成

■第3章
この章から本格的なサンプルアプリケーションの開発を始めるそう。以降の章で色んな機能を足していく(マイクロポスト、ログイン/ログアウト等)。つまりこの章がちゃんとできないと終わりってことか...

3.1 セットアップ

2章と同様に、新しいRailsプロジェクトの作成から

$ cd ~/environment
$ rails _5.1.6_ new sample_app
$ cd sample_app/

またGemfileの中身を置き換え、ここら辺は慣れてきましたね。
前の2つの章と同様にbundle installを実行して、Gemfileで指定したgemのインストールをする。

以下のコマンドで、roduction環境でしか使わないgemはインストールしないようにしておく。

bundle install --without production

このコマンドを実行することで、インストールなしでSQLiteが使えるようになるらしい。

ここまできたら、Gitリポジトリの初期化を行う。

$ git init
$ git add -A
$ git commit -m "Initialize repository"

その後はREADME.mdファイルを更新して、具体的な作業内容を記入する。
書き終わったら、この変更をコミット。

$ git commit -am "Improve the README"

今後もこのサンプルアプリケーションを使い続けるので、Bitbucket上にリポジトリを作成してpushしておく。

$ git remote add origin [e-mail]:ユーザー名/sample_app.git
$ git push -u origin --all    

後でproduction環境にプッシュするときに悩まずに済むよう、アプリをなるべく早い段階でHerokuにデプロイしておくとよいそう。

第2章と同様にpp/controllers/application_controller.rbに以下のコードを追加

def hello
    render html: "hello, world!"
  end

config/routes.rbでルーティングの設定

root 'application#hello'

終わったら次のように変更をコミットし、Herokuにプッシュする

$ git commit -am "Add hello"
$ git push
$ heroku create
$ git push heroku master

警告は無視していいらしい。

3.2 静的ページ

この節ではRailsのアクションやビューを使って色々やっていく。Gitを使う場合は、masterブランチでずっと作業するのではなく、その都度トピックブランチを作成して作業するのがよい習慣だそう。

次のコマンドを実行して、静的なページ用のトピックブランチをチェックアウトする。

$ git checkout -b static-pages

3.2.1 静的なページの生成

このコントローラは静的なページを扱うためにしか使わないので、StaticPagesコントローラを生成する。

$ rails generate controller StaticPages home help

次に進む前に、StaticPagesコントローラファイルをGitリポジトリに追加しておく。

$ git add -A
$ git commit -m "Add a Static Pages controller"
$ git push -u origin static-pages

実際の開発ではこまめにgitにpushしておく

3.2.2 静的なページの調整

HTMLの中身を弄るだけ。割愛。

3.3 テストから始める

何らかの変更を行う際には、常に「自動化テスト」を作成して、機能が正しく実装されたことを確認する習慣を身につけることが推奨されている。

テストを行うメリットとしては
・いざというときのセーフティネットになる
・テストを作成する=その分コードを余分に書くこと。しかし正しく行えば、むしろテストがないときよりも確実に開発速度がアップ
・機能停止するバグの防止

テストを書くのに慣れていると、テストを先に書くようになるらしい。

本書における主要なテストは、コントローラテスト (この章より)、モデルテスト (第6章より)、統合テスト (第7章より) の3つ。

3.3.1 最初のテスト

サンプルアプリケーションのAboutページの作成に取りかかる。テストを先に書いて、実行が失敗することを確認して、実際のアプリケーションにコードを書く。

StaticPagesコントローラのデフォルトのテストがあって中身について説明がある。

実際にテストしてみる。

$ rails test
2 tests, 2 assertions, 0 failures, 0 errors, 0 skips

3.3.2 Red

多くのテストツールでは、テストの失敗を red 、成功したときを green で表す。

一歩目として、Aboutページ用の失敗するテストを書く。

test/controllers/static_pages_controller_test.rbに以下のコードを追加。

test "should get about" do
    get static_pages_about_url
    assert_response :success
  end

テストを実行すると、ちゃんと失敗しました。

$ rails test
3 tests, 2 assertions, 0 failures, 1 errors, 0 skips

3.3.3 Green

3.3.2のテスト失敗の原因はAboutページがないこと。メッセージをヒントに、ルーティングファイルを修正していく。

config/routes.rbに

get  'static_pages/about'

追記する。

修正後テストスイートしたら、今度は別のエラーが

$ rails test
AbstractController::ActionNotFound:
The action 'about' could not be found for StaticPagesController

このエラーからStaticPagesコントローラにaboutアクションがないということがわかる。app/controllers/static_pages_controller.rbにaboutアクションを追加する。

また別のエラーが。

$ rails test
ActionController::UnknownFormat: StaticPagesController#about
is missing a template for this request format and variant.

今度はテンプレートがないっぽい。Railsでは、テンプレート「ビュー」を指す。
このビューはapp/views/static_pagesディレクトリにあるので、ここにabout.html.erbというファイルを作成する。
指示通り書き換えてテストをすると、無事Greenに。

$ rails test
3 tests, 3 assertions, 0 failures, 0 errors, 0 skips

3.3.4 Refactor

開発が進むといろんなとこがごっちゃになってしまうので、こまめなリファクタリングの習慣をできるだけ早いうちに身につけた方が良いらしい。

3.4 少しだけ動的なページ

静的なページのアクションやビューをいくつか作成できたので、今度はそれをほんの少しだけ動的にしてみる。ここでの目標は、Homeページ、Helpページ、Aboutページをそれぞれ編集し、最終的にページごとに異なるタイトルを表示すること。
ここではビューのタイトルタグを変更する。titleタグは、いわゆるSEOでも重要な役割を果たす。

3つの静的ページのタイトルを
「<ページ名> | Ruby on Rails Tutorial Sample App」
という形式に変更する。<ページ名>の部分が、表示しているページに応じて、動的に変化する。

ここでは学習のために、一時的に次のようにファイル名を変更する。

$ mv app/views/layouts/application.html.erb layout_file

実際のアプリケーション開発時にはこんなことはしないらしい。

3.4.1 タイトルをテストする (Red)

assert_selectメソッドでは、特定のHTMLタグが存在するかどうかをテストする。
test/controllers/static_pages_controller_test.rbをまた書き換え。

$ rails test
3 tests, 6 assertions, 3 failures, 0 errors, 0 skips

テストするとこんな感じに。

3.4.2 タイトルを追加する (Green)

テストがパスするようにする。
ビューに色々追記してテストするとGreenに。

$ rails test
3 tests, 6 assertions, 0 failures, 0 errors, 0 skips

3.4.3 レイアウトと埋め込みRuby (Refactor)

同じコードを繰り返すことはRubyの「DRY」(Don’t Repeat Yourself: 繰り返すべからず)に反する。

重複を取り除いていく。Railsのprovideメソッドを使ってタイトルをページごとに変更していく。HTMLの中身をまた書き換え。

$ mv layout_file app/views/layouts/application.html.erb

layout_fileを元に戻しておく。
app/views/layouts/application.html.erbの中身を書き換え。
ビューのHTML構造を削除。

テストするとGreenに。

$ rails test
3 tests, 6 assertions, 0 failures, 0 errors, 0 skips

リファクタリングはどんな小さなものでもベテランは侮らないらしい。

3.4.4 ルーティングの設定

routes.rbファイルを編集。割愛。

3.5 最後に

この章で動的なコンテンツを作れた気はしないが、これからどんどん増やしていくことになるっぽい。

3.6 高度なセットアップ

追加の節。テスト用設を定する。
とりあえずmasterにブランチを変えておく。

$ cd ~/environment/sample_app
$ git branch master

3.6.1 minitest reporters

test/test_helper.rbに追記。IDE上の表記に色がつきました。

3.6.2 Guardによるテストの自動化

手動でコマンドを打ち込み、実行しなければならないめんどくささの解消のため、、Guardを使ってテストを自動的に実行させる。

Gemfileでguard gemをアプリケーション内に取り込んでるみたいなので、あとは初期化だけで動かせるっぽい。

$ bundle exec guard init

その後、Guardfileを変更。

Guard使用時のSpringとGitの競合を防ぐには、.gitignoreファイルにspring/を追加する
ただし手順は以下の通り
1.ナビゲーションパネルの右上にある歯車アイコンをポチ
2.show hidden filesを選択して非表示ファイルを表示
3..gitignoreを開いて以下を末尾に追加

Guardを終了するときはCtrl+D。springが悪さをして重くなることがあるので、必要に応じてSpringをkillするといい。

感想

第3章はほぼエラーなくスムーズにやることができました。
ファイルの配置とかもだいぶ覚えてきて、このファイルならここらへんかなーみたいな感覚もちょっとずつ出てくるようになりました。
なんで動いてるのかよくわからないまま、フワフワして進んでますが、続きも頑張ります。

疑問・単語集

・短縮形

完全なコマンド	短縮形
$ rails server	$ rails s
$ rails console	$ rails c
$ rails generate	$ rails g
$ rails test	$ rails t
$ bundle install	$ bundle

　　
　　
　　
・キャメルケースとスネークケース

単語の頭文字を大文字にしてつなぎ合わせた名前=キャメルケース　例）StaticPages
単語間にアンダースコアを加えて繋ぎ合わせた名前＝スネークケース　例）static_pages_controller.rb

$rails generate controller StaticPages home help

キャメルケースでStaticPagesコントローラ名生成すると
自動でスネークケースにしたファイルstatic_pages_controller.rbを自動的に生成する。

$ rails generate controller static_pages ...

しても同じ結果になる。
Rubyの慣習の問題でキャメルケースで記述する慣習がある。

・拡張子のerbはEmbeded Rubyの略
　
　　
　　
・元に戻す方法
コントローラを生成すると、Railsはコントローラ以外に関連したファイルを大量に生成するので、コントローラファイルを削除しただけでは元通りにならない。

$ rails destroyというコマンドを実行することで元に戻すことができる。例えば次の2つのコマンドは、自動生成と、それに対応する取り消し処理の例。

  $ rails generate controller StaticPages home help
  $ rails destroy  controller StaticPages home help

マイグレーションの変更を元に戻す方法も用意されている。

$ rails db:migrate

でマイグレーションを変更したら

元に戻したいときは、db:rollbackで1つ前の状態に戻します。

$ rails db:rollback

最初の状態に戻したいときは、VERSION=0オプションを使います。

$ rails db:migrate VERSION=0