ぞえの技術めも

Ruby on Rails勉強中

【164日目】【1日20分のRailsチュートリアル】【第11章】演習の1.

Ruby on Railsチュートリアル(第3版)

今日は「11.6 演習」から。

11.6 演習

なお、演習とチュートリアル本編の食い違いを避ける方法については、演習用のトピックブランチに追加したメモ (3.6) を参考にしてください。

演習用にブランチ切っておきましょう。

$ git checkout user-microposts
$ git checkout -b user-microposts-exercises

1.if-else文の2つの分岐に対して、それぞれ異なるパーシャルを使用するようにHomeページをリファクタリングしてください。

ノーヒント…!!

11.3.2 マイクロポストを作成する」にちらっと書かれてる下記のことか。

if-else分岐を使用してコードを書き分けている点が少し汚いですが、このコードのクリーンアップは演習に回すことにします (11.6)。

Homeページのif-else文ていうのはユーザーがログインしているかどうかのif-else文。 ユーザーがログインしていればユーザー情報やマイクロポストの表示をするけど、ログインしていなければサインアップを促す内容を表示する。

それぞれの内容をパーシャル化するとして、ユーザーログインに関するif文はどこに持ってけばいいのかな…。パーシャルの方でいいのかな。

まずパーシャル用のファイルを作成して、(ファイル名が微妙なのは気にしてはいけない)

$ touch app/views/shared/_home_logged_in.html.erb
$ touch app/views/shared/_home_welcome.html.erb

if-else分岐の内容をとりあえずコピペ。if文も持ってきてみたよ。

app/views/shared/_home_logged_in.html.erb

<% if logged_in? %>
  <div class="row">
    <aside class="col-md-4">
      <section class="user_info">
        <%= render 'shared/user_info' %>
      </section>
      <section class="micropost_form">
        <%= render 'shared/micropost_form' %>
      </section>
    </aside>
    <div class="col-md-8">
      <h3>Micropost Feed</h3>
      <%= render 'shared/feed' %>
    </div>
  </div>
<% end %>

app/views/shared/_home_welcome.html.erb

<% if !logged_in? %>
  <div class="center jumbotron">
    <h1>Welcome to the Sample App</h1>
  
    <h2>
      This is the home page for the
      <a href="http://www.railstutorial.org/">Ruby on Rails Tutorial</a>
      sample application.
    </h2>
  
    <%= link_to "Sign up now!", signup_path, class: "btn btn-lg btn-primary" %>
  </div>
  
  <%= link_to image_tag("rails.png", alt: "Rails logo"),
              'http://rubyonrails.org/' %>
<% end %>

そして作成したパーシャルを使ってHomeページのビューを更新。わー、シンプル。

app/views/static_pages/home.html.erb

<%= render 'shared/home_logged_in' %>
<%= render 'shared/home_welcome' %>

これでいいのかな…。テストはとりあえず通った。

$ bundle exec rake test
59 tests, 306 assertions, 0 failures, 0 errors, 0 skips

心配なので実動作も見てみたけどとりあえず問題なさそう…??

↓ログイン済みの場合

f:id:kt_zoe:20170718123547p:plain

↓ログインしてない場合

f:id:kt_zoe:20170718123602p:plain

合ってるかは分からないけどシンプルにはなったので良しとしよう。

今日の学習時間は【29分】

次は「11.6 演習」の2.から。