scaffoldで生成されたコードから紐解くRails 5の基本構成

サンプルコードで学ぶRuby on Rails 5実践入門 第3回

　前回はRails 5のプロジェクト作成、scaffoldで自動生成したソースコードを元にルーティングを確認しました。第3回となる今回は、実際の動作をソースコードと関連付けて各アクションについて解説します。

scaffoldを利用したRailsアプリケーションの基本動作確認（続き）（1）

　前回まではscaffoldで自動生成したソースコードのうち、ルーティングを確認しました。今回からは自動生成されたUsersコントローラーの各アクションを、実際の動作と見比べながら解説します。

Usersリソース一覧（indexアクション）

　まずUsersリソース一覧、つまりuserコントローラーのindexアクションへアクセスをします。先ほどの実行結果のURIを確認するとURIは/usersですので、http://localhost:3000/usersへアクセスします。以下のような画面が表示されるはずです。

図1　http://localhost:3000/users

　アクセスすると分かる通り、まだusersテーブルには何も入っておらず空なので、Usersリソースに関するレコードは何も表示されません。ここで対応するusersコントローラーのソースコードを確認します。

リスト1　app/controllers/users_controller.rb

class UsersController < ApplicationController
…（中略）…
  def index
    @users = User.all
  end
…（中略）…

　indexメソッドが追加されており、ActiveRecordのallメソッドを使用して全てのUserモデルを@usersインスタンス変数に代入しているコードが自動生成されています。コントローラーでアサインされたインスタンス変数はビュー側で利用することができるようになります。

　対応するビュー側のソースコードを確認します。

リスト2　app/views/users/index.html.erb

…（中略）…
  <tbody>
    <% @users.each do |user| %>
      <tr>
        <td><%= user.name %></td>
        <td><%= user.email %></td>
        <td><%= link_to 'Show', user %></td>
        <td><%= link_to 'Edit', edit_user_path(user) %></td>
        <td><%= link_to 'Destroy', user, method: :delete, data: { confirm: 'Are you sure?' } %></td>
      </tr>
    <% end %>
  </tbody>
…（中略）…

　ビューファイルで@usersをeachでループしてuserレコードのnameとemailをテーブルで表示し、それぞれのレコードの操作であるShow（表示）、Edit（編集）、Destroy（削除）が定義されていることが分かります。

　link_toはRailsが提供するヘルパーメソッドの1つです。文字通りリンク（アンカーテキスト）のhtmlを出力します。第1引数にリンクの表示文字列、第2引数にパスを指定します。第3引数以降はハッシュでオプションを指定することができます。

　なお、ShowとDestroyの第2引数は少し特殊な省略形となっており、userレコードそのものが指定されています。これに対応するパスは/users/:idで、（userオブジェクトのid値が1の場合は）/users/1のようなパスが生成されます。

　Editの第2引数にあるedit_user_pathはRailsが提供するURLヘルパーです。これに、モデルオブジェクトを渡すことで、対応するパスを生成できます。edit_user_pathは/users/:id/editを表しますので、（userオブジェクトのid値が1の場合は）/users/1/editのようなパスが生成されます。

Userモデルインスタンス生成（newアクション）

　Usersリソース一覧から実際にusersテーブルへレコードを作成してみましょう。http://localhost:3000/usersの画面からNew Userのリンクをクリックすると以下の画面へ遷移します。

図2　http://localhost:3000/users/new

　nameとemailの入力画面が出力されました。name、emailを適当に入力してCreate Userボタンをクリックするとusersテーブルのレコードを入力して生成することができます。レコード作成前に該当するコントローラーとビューファイルを確認してみましょう。

リスト3　app/controllers/users_controller.rb

class UsersController < ApplicationController
…（中略）…
  def new
    @user = User.new
  end
…（中略）…

リスト4　app/views/users/new.html.erb

<h1>New User</h1>

<%= render 'form', user: @user %>

<%= link_to 'Back', users_path %>

　コントローラーではUserモデルのインスタンスをnewして@userインスタンス変数に代入しています。ビューではformという部分テンプレートを、renderメソッドを用いてレンダリングしています。renderメソッドはRailsが提供するヘルパーメソッドで、ビューファイルを特定のブロックごとに切り出す用途として使います。切り出されたテンプレートのことを部分テンプレートと呼びます。

　第1引数が部分テンプレートの名前です。第2引数では、userというローカル変数に@userインスタンス変数を代入しています。こうすることで、form部分テンプレートでuserという変数を使用することができます。

　それではform部分テンプレートを確認してみましょう。部分テンプレートはリソースと同一のビューディレクトリに、アンダースコアが付与されたファイル名のものが呼び出されます。このケースではapp/views/users/_form.html.erbが部分テンプレートとなります。

リスト5　app/views/users/_form.html.erb

<%= form_for(user) do |f| %>
…（中略）…
  <div class="field">
    <%= f.label :name %>
    <%= f.text_field :name %>
  </div>

  <div class="field">
    <%= f.label :email %>
    <%= f.text_field :email %>
  </div>

  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

　form_forヘルパーメソッドでUserモデルのレコードを生成するためにuser変数を使用したフォーム関連のhtmlを作成しています。form_forメソッドの引数にActiveRecordのインスタンスを指定して変数fをブロックに渡しています。このように定義すると、ブロック内で「f.label :name」とすることでラベルのhtmlを、「f.text_field :email」とすることでテキストフィールドのhtmlを生成できます。

　具体的には「<label for="user_name">Name</label>」というhtmlと「<input type="text" name="user[name]" id="user_name">」というhtmlが生成されます。テキストフィールドのname属性の値がuser[name]、id属性の値がuser_nameとなっていることに注目してください。リソース名+リソースのカラム名のルールでid値が生成されることが分かります。

　f.submitメソッドはCreate Userボタンのhtmlを生成しています。