Rails Tutorial 第4版 第2章 演習 解答例
この文書はRails Tutorial 第4版 第2章 Toyアプリケーションの演習に対する個人の解答例です。解答には誤りや不適切な表現が含まれていることがありますが、もし誤謬を見つけたらコメント頂けると嬉しいです。
それでは、やっていきましょう!
- 2.1 アプリケーションの計画
- 2.2 Usersリソース
- 2.3 Micropostsリソース
- 2.3.1 マイクロポストを探検する
- 1. CSSを知っている読者へ: 新しいマイクロポストを作成し、ブラウザのHTMLインスペクター機能を使って「Micropost was successfully created.」の箇所を調べてみてください。ブラウザをリロードすると、その箇所はどうなるでしょうか?
- 2. マイクロポストの作成画面で、ContentもUserも空にして作成しようとするどうなるでしょうか?
- 3. 141文字以上の文字列をContentに入力した状態で、マイクロポストを作成しようとするとどうなるでしょうか? (ヒント: WikipediaのRubyの記事にある1段落目がちょうど150文字程度ですが、どうなりますか?)
- 4. 上記の演習で作成したマイクロポストを削除してみましょう。
- 2.3.2 マイクロポストをマイクロにする
- 2.3.3 ユーザーはたくさんマイクロポストを持っている
- 1. ユーザーのshowページを編集し、ユーザーの最初のマイクロポストを表示してみましょう。同ファイル内の他のコードから文法を推測してみてください (コラム 1.1で紹介した技術の出番です)。うまく表示できたかどうか、/users/1 にアクセスして確認してみましょう。
- 2. リスト 2.16は、マイクロポストのContentが存在しているかどうかを検証するバリデーションです。マイクロポストが空でないことを検証できているかどうか、実際に試してみましょう (図 2.16のようになっていると成功です)。
- 3. リスト 2.17のFILL_INとなっている箇所を書き換えて、Userモデルのnameとemailが存在していることを検証してみてください (図 2.17)。
- 2.3.4 継承の階層
- 2.3.5 アプリケーションをデプロイする
- 2.3.1 マイクロポストを探検する
- 2.4 最後に
2.1 アプリケーションの計画
2.1.1 ユーザーのモデル設計
演習なし。
2.1.2 マイクロポストのモデル設計
演習なし。
2.2 Usersリソース
2.2.1 ユーザーページを探検する
1.CSSを知っている読者へ: 新しいユーザーを作成し、ブラウザのHTMLインスペクター機能を使って「User was successfully created.」の箇所を調べてみてください。ブラウザをリロードすると、その箇所はどうなるでしょうか?
消えます。つまり、ユーザーを作成した直後に一度だけ「User was successfully created.」と表示されるようになっています。
2. emailを入力せず、名前だけを入力しようとした場合、どうなるでしょうか?
emailを持たないユーザーが作成されます。さらに言えば、現状では名前とemailのいずれか、いずれも空欄にした場合もユーザーを作成することができてしまいます。
3. 「@example.com」のような間違ったメールアドレスを入力して更新しようとした場合、どうなるでしょうか?
更新に成功します。
4. 上記の演習で作成したユーザーを削除してみてください。ユーザーを削除したとき、Railsはどんなメッセージを表示するでしょうか?
h1タグの見出しの上に次のメッセージを表示します。
User was successfully destroyed.
補足としてこの箇所のHTMLを以下に示します。
<body> <p id="notice">User was successfully destroyed.</p> <h1>Users</h1> ... </body>
2.2.2 MVCの挙動
1. 図 2.11を参考にしながら、/users/1/edit というURLにアクセスしたときの振る舞いについて図を書いてみてください。
2. 図示した振る舞いを見ながら、Scaffoldで生成されたコードの中でデータベースからユーザー情報を取得しているコードを探してみてください。
データベースからユーザー情報を取得するのはUsersControllerなので、users_controller.rbを調べれば良さそうです。以下の@user = User.find(params[:id])
が該当のコードです。
users_controller.rb
... # Use callbacks to share common setup or constraints between actions. def set_user @user = User.find(params[:id]) end ...
3. ユーザーの情報を編集するページのファイル名は何でしょうか?
edit.html.erb
2.2.3 Usersリソースの欠点
演習なし。
2.3 Micropostsリソース
2.3.1 マイクロポストを探検する
1. CSSを知っている読者へ: 新しいマイクロポストを作成し、ブラウザのHTMLインスペクター機能を使って「Micropost was successfully created.」の箇所を調べてみてください。ブラウザをリロードすると、その箇所はどうなるでしょうか?
ブラウザをリロードすると「Micropost was successfully created.」の表示は消えます。この間のHTMLの変化を次に示します。
マイクロポスト新規作成直後
<p id="notice">Micropost was successfully created.</p>
ブラウザリロード後
<p id="notice"></p>
2. マイクロポストの作成画面で、ContentもUserも空にして作成しようとするどうなるでしょうか?
ContentもUserも空のマイクロポストを作成します。
3. 141文字以上の文字列をContentに入力した状態で、マイクロポストを作成しようとするとどうなるでしょうか? (ヒント: WikipediaのRubyの記事にある1段落目がちょうど150文字程度ですが、どうなりますか?)
作成に成功します。
4. 上記の演習で作成したマイクロポストを削除してみましょう。
削除してみます。
2.3.2 マイクロポストをマイクロにする
1. 先ほど2.3.1.1の演習でやったように、もう一度Contentに141文字以上を入力してみましょう。どのように振る舞いが変わったでしょうか?
新規マイクロポストのページに遷移せず、次のエラーメッセージが表示されます。
1 error prohibited this micropost from being saved:
Content is too long (maximum is 140 characters)
2. CSSを知っている読者へ: ブラウザのHTMLインスペクター機能を使って、表示されたエラーメッセージを調べてみてください。
該当箇所のHTMLを以下に示します。
<div id="error_explanation"> <h2>1 error prohibited this micropost from being saved:</h2> <ul> <li>Content is too long (maximum is 140 characters)</li> </ul> </div>
対応するCSSは次のようになっています。
#error_explanation h2 { text-align: left; font-weight: bold; padding: 5px 5px 5px 15px; font-size: 12px; margin: -7px -7px 0; background-color: #c00; color: #fff; } ... #error_explanation ul li { font-size: 12px; list-style: square; }
2.3.3 ユーザーはたくさんマイクロポストを持っている
1. ユーザーのshowページを編集し、ユーザーの最初のマイクロポストを表示してみましょう。同ファイル内の他のコードから文法を推測してみてください (コラム 1.1で紹介した技術の出番です)。うまく表示できたかどうか、/users/1 にアクセスして確認してみましょう。
/views/users/show.html.erbに以下のコードを追記します。
<p> <strong>Micropost:</strong> <%= @user.microposts.first.content %> </p>
/users/1にアクセスすると次のような形式で表示されるようになります。
Name: foobar
Email: foo@example.com
Micropost: hi!
Edit | Back
2. リスト 2.16は、マイクロポストのContentが存在しているかどうかを検証するバリデーションです。マイクロポストが空でないことを検証できているかどうか、実際に試してみましょう (図 2.16のようになっていると成功です)。
図 2.16のようになり、成功します。
3. リスト 2.17のFILL_INとなっている箇所を書き換えて、Userモデルのnameとemailが存在していることを検証してみてください (図 2.17)。
以下のように書き換えます。これによりUserモデルのnameとemailが存在していないとユーザーの作成や更新ができなくなります。
app/models/user.rb
class User < ApplicationRecord has_many :microposts validates :name, presence: true validates :email, presence: true end
2.3.4 継承の階層
1. Applicationコントローラのファイルを開き、ApplicationControllerがActionController::Baseを継承している部分のコードを探してみてください。
/app/controllers/application_controller.rb
class ApplicationController < ActionController::Base
2. ApplicationRecordがActiveRecord::Baseを継承しているコードはどこにあるでしょうか? 先ほどの演習を参考に、探してみてください。ヒント: コントローラと本質的には同じ仕組みなので、app/modelsディレクトリ内にあるファイルを調べてみると...?)
app/models/application_record.rb
class ApplicationRecord < ActiveRecord::Base
2.3.5 アプリケーションをデプロイする
1. 本番環境で2〜3人のユーザーを作成してみましょう。
作成してみます。
2. 本番環境で最初のユーザーのマイクロポストを作ってみましょう
作ってみます。
3. マイクロポストのContentに141文字以上を入力した状態で、マイクロポストを作成してみましょう。リスト 2.13で加えたバリデーションが本番環境でもうまく動くかどうか、確認してみてください。
以下のエラーが現れたため、本番環境でもバリデーションが効いていることが確認できました。
1 error prohibited this micropost from being saved:
Content is too long (maximum is 140 characters)
2.4 最後に
2.4.1 本章のまとめ
演習なし。
完