Rails Tutorialの勉強記録 Chapter 7

Webアプリの知識が乏しいので，一度読んだRuby on Rails Tutorialを復習しています．今日は7章をやったので，便利だなと思った機能をまとめました．記録をつけようと思ったのがかなりあとになってからなので，7章からになっています．

Chapter 7では，sign upページを作ります．

`debug`メソッド

`debug`メソッドは，`<pre>`タグを返します．引数に変数を渡すと，その変数をYAML形式で表示してくれます．

例えば，HTTPリクエストのパラメタを確認したい場合は，embedded Rubyに`<%= debug(params) if Rails.env.development? %>`を書くと，`params`の内容がYAML形式でブラウザで見ることができます．

ちなみに`Rails.env.development`は，`development`環境の場合に`true`になるので，間違えてproduction環境で，デバッグ情報が表示されないようになります．

参考

Rails guid debug

Sassのmixin

Sassは，Syntactically Awesome Style Sheetsと呼ばれるCSSのsuper setです．なので，純粋なCSSはSassでもあります．

SassはCSSに便利な機能が追加されており，その中の一つがmixinです．CSSのルールをまとめて，再利用できるコンポーネントを作ってくれます．`@mixin`で，以下のコードのように関数のように定義します．

@mixin box_sizing {
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
}

このmixinを適用したい場合は，`@include box_sizing`を使えば良いです．

input, textarea, select, .uneditable-input {
 border: 1px solid #bbb;
 width: 100%;
 margin-bottom: 15px;
 @include box_sizing;
}

Rails Environments

Railsには標準で三つの環境があります．`production`，`development`，`test`があります．`debug`の例のように，developmentでのみ有効であって欲しい機能だったりをかけます．また本番ではMySQLを使うが，developmentは簡便のために，SQLiteを使うといった場合，使うGemが異なります．そういった場合にも，環境によって，どのGemをインストールするかなども制御できます．

`resources`

Railsはmodelで定義されたデータを`resource`としてREST URLで操作する．

`routes.rb`に，`resources :users`と書けば，暗黙的に以下のようなroutesが定義される．

引用: Rails Routing from the Outside In

`form_with` helper

新しいuserを作るためのformを作成するため，HTMLでformタグを作る必要がある．その時にRailsが提供するhelper functionが`form_with`．

`form_with`は，`model`という引数に，modelのobjectを渡すと，そのmodel objectとformを関連づけることができる．

関連づくと，submitした後に対応したmodelのcontrollerのactionを呼び出してくれます．もちろん，陽に指定することもできます．

controller側では，新しい`@user`を作り，対応するviewのembedded Rubyに

    <%= form_with(model: @user, local: true) do |f| %>
     <%= render 'shared/error_messages' %>
     <%= f.label :name %>
     <%= f.text_field :name, class: 'form-control' %>

     <%= f.label :email %>
     <%= f.email_field :email, class: 'form-control' %>

     <%= f.label :password %>
     <%= f.password_field :password, class: 'form-control '%>

     <%= f.label :password_confirmation %>
     <%= f.password_field :password_confirmation, class: 'form-control' %>

     <%= f.submit "Create my account", class: "btn btn-primary" %>
   <% end %>

と書くと，

<form action="/users" accept-charset="UTF-8" method="post">
<input type="hidden" name="authenticity_token" value="huge">
     
     <label for="user_name">Name</label>
     <input class="form-control" type="text" name="user[name]" id="user_name">

     <label for="user_email">Email</label>
     <input class="form-control" type="email" name="user[email]" id="user_email">

     <label for="user_password">Password</label>
     <input class="form-control " type="password" name="user[password]" id="user_password">

     <label for="user_password_confirmation">Password confirmation</label>
     <input class="form-control" type="password" name="user[password_confirmation]" id="user_password_confirmation">

     <input type="submit" name="commit" value="Create my account" class="btn btn-primary" data-disable-with="Create my account">
</form>

という対応になる．

submissionした後は，`params[:user]`で入力したデータのhashにアクセスすることができます．

`flash`

`flash`変数は，ページが遷移した一度だけ中身が入る．ページをrefreshしたりすると，中身が消えるので，signupした一度だけコメントを出したい時に使う．

controller側で`flash[:success] = "Welcome to the Sample App!"`と書いて，view側で

      <% flash.each do |message_type, message| %>
       <%= content_tag(:div, message, class: "alert alert-#{message_type}") %>
     <% end %>

と書けば，一度だけ上のcontrollerが呼ばれてこのviewに遷移した時だけコメントが出る．

integration tests

`rails generate integration_test hoge`と書くと，integration testが生成される．

具体例は以下のよう．

  test "invalid signup information" do
   get signup_path
   assert_no_difference "User.count" do
     post users_path, params: { user: { name: "",
                                         email: "user@invalid",
                                         password: "foo",
                                         password_confirmation: "bar" } }
   end
   assert_template "users/new"
   assert_select 'div#error_explanation'
   assert_select 'div.field_with_errors'
 end

サインアップページに行って，新規ユーザーを作り，入力が不正な場合は，Userのmodelの数は増えてないことを確認し，もう一度サインアップページに戻り，エラーのHTMLタグがあるかどうかを確認する．

このようにユーザーの行動の流れも簡単にテストできる．

終わり

次は，8章に入ります．早く流れを思い出して，自分なりのアプリでも作ってみようと思います．