railsチュートリアル 第七章


はじめに

railsチュートリアルで理解しにくいところや、詰まったところを書いていく記事になります。
なので、手順を示す記事とはなっていません。

デバッグ

共通のビューファイルにdebugメソッドを書くことで、各ページでデバッグ用の情報が表示されるようになる。

デバッグを出力することで、ページの状態が把握しやすくなる。

app/views/layouts/application.html.erb
<!DOCTYPE html>
<html>
  .
  .
  .
  <body>
  .
  .
    <%= debug(params) if Rails.env.development? %>
  </body>
</html>

if Rails.env.development?
としておくことで、開発環境だけで表示されるようになる。

Usersリソース

config/routes.rb
resources :users

routesファイルに↑の一行を追加するだけで、ユーザーのURLを生成するための多数の名前付きルート (5.3.3) と共に、RESTfulなUsersリソースで必要となるすべてのアクションが利用できるようになる。

HTTPリクエスト URL アクション 名前付きルート 用途
GET /users index users_path すべてのユーザーを一覧するページ
GET /users/1 show user_path(user) 特定のユーザーを表示するページ
GET /users/new new new_user_path ユーザーを新規作成するページ (ユーザー登録)
POST /users create users_path ユーザーを作成するアクション
GET /users/1/edit edit edit_user_path(user) id=1のユーザーを編集するページ
PATCH /users/1 update user_path(user) ユーザーを更新するアクション
DELETE /users/1 destroy user_path(user) ユーザーを削除するアクション

ただ、このルーティング先には表示するページとアクションが用意されていないから、各々準備する必要がある。

ユーザー登録フォーム

ユーザー情報を入力するために、form_forヘルパーメソッドを使う。
このメソッドはActive Recordのオブジェクトを取り込み、そのオブジェクトの属性を使ってフォームを構築する。

まず、新規ユーザーのためのユーザー登録フォーム
は下のようなものになる。

app/controllers/users_controller.rb
def new
    @user = User.new
end
app/views/users/new.html.erb
% provide(:title, 'Sign up') %>
<h1>Sign up</h1>

<div class="row">
  <div class="col-md-6 col-md-offset-3">
    <%= form_for(@user) do |f| %>
      <%= f.label :name %>
      <%= f.text_field :name %>

      <%= f.label :email %>
      <%= f.email_field :email %>

      <%= f.label :password %>
      <%= f.password_field :password %>

      <%= f.label :password_confirmation, "Confirmation" %>
      <%= f.password_field :password_confirmation %>

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

例えば
<%= f.label :name %>
<%= f.text_field :name %>

という埋め込みruby部分では、
以下のようなHTMLを生成している。

<label for="user_name">Name</label>
<input id="user_name" name="user[name]" type="text" />

ブラウザからソースを表示することもできるがフォーム部分をHTMLで表すと以下のようになる。

<form accept-charset="UTF-8" action="/users" class="new_user"
      id="new_user" method="post">
  <input name="utf8" type="hidden" value="&#x2713;" />
  <input name="authenticity_token" type="hidden"
         value="NNb6+J/j46LcrgYUC60wQ2titMuJQ5lLqyAbnbAUkdo=" />
  <label for="user_name">Name</label>
  <input id="user_name" name="user[name]" type="text" />

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

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

  <label for="user_password_confirmation">Confirmation</label>
  <input id="user_password_confirmation"
         name="user[password_confirmation]" type="password" />

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

<form action="/users" class="new_user" id="new_user" method="post">
の部分では、/users に対してHTTPのPOSTリクエスト送信する、といった指示をしてる。

このフォームの値はcreateアクションに送られるようになる。
createアクション内では、

@user = User.new(params[:user])

のように@userを定義すればいいが、paramsハッシュ全体を初期化するという行為はセキュリティ上よろしくない。

この場合、user_paramsという外部メソッドを使ういことが慣習とされている。
よってcreateアクションは以下のようなものとなる。

app/controllers/users_controller.rb
class UsersController < ApplicationController
  .
  .
  .
  def create
    @user = User.new(user_params)
    if @user.save
      # 保存の成功をここで扱う。
    else
      render 'new'
    end
  end

  private

    def user_params
      params.require(:user).permit(:name, :email, :password,
                                   :password_confirmation)
    end
end

privateキーワードを使って外部からはprivate内のメソッドを使えないようにする。

user_paramsを定義することにより、
paramsハッシュでは:user属性を必須とし、名前、メールアドレス、パスワード、パスワードの確認の属性をそれぞれ許可し、それ以外を許可しないようになる。

flash

ユーザー登録が成功すれば、登録完了後に表示されるページにメッセージを表示し、二度目以降には表示しないというものがよく見かける。

そういったメッセージ(フラッシュメッセージ)を表示したい場合は、flash変数を使う。

例:

app/controllers/users_controller.rb
def create
    @user = User.new(user_params)
    if @user.save
      flash[:success] = "Welcome to the Sample App!"
      redirect_to @user
    else
      render 'new'
    end
end

成功時はflash[:success]の:sucessというキーを使うことが慣習とされている。

また、このフラッシュメッセージをサイト全体で表示したい場合はapplication.html.erbは次のようなコードとなる。

app/views/layouts/application.html.erb
<!DOCTYPE html>
<html>
  .
  .
  .
  <body>
    <%= render 'layouts/header' %>
    <div class="container">
      <% flash.each do |message_type, message| %>
        <div class="alert alert-<%= message_type %>"><%= message %></div>
      <% end %>
      <%= yield %>
      <%= render 'layouts/footer' %>
      <%= debug(params) if Rails.env.development? %>
    </div>
    .
    .
    .
  </body>
</html>

<div class="alert alert-<%= message_type %>"><%= message %></div>
の部分では、メッセージの種類を適応するCSSによって、変更するようにしている。

例えば、

<div class="alert alert-<%= message_type %>"><%= message %></div>
というコードをHTMLで表示すると

<div class="alert alert-success">Welcome to the Sample App!</div>

というふうになる。

おわり

この章では、主にユーザー登録、フラッシュメッセージを見てきた。
もう一度、7章をするときはエラーメッセージやSSLについてもう少し深く見ていこうと思う。

次↓
https://qiita.com/jonnyjonnyj1397/items/051ca887525f474ffbfb