【175日目】【1日20分のRailsチュートリアル】【第12章】フォローしているユーザー/フォロワーページを作成する
今日は「12.2.3「フォローしているユーザー」ページと「フォロワー」ページ」から。
12.2.3「フォローしているユーザー」ページと「フォロワー」ページ
フォローしているユーザーを表示するページと、フォロワーを表示するページは、いずれもユーザープロファイルページとユーザーインデックスページ (9.3.1) を合わせたような作りになるという点で似ています。
モックアップを見ても違いがよく分からないな…。
レイアウトはほぼ一緒だけど、表示するユーザーとの関係性が違ってくるのかな。
前回のアクセス制御と同様に、まずはテストから書いていきます。今回使うテストはリスト12.24のとおりです。
followingアクションとfollowersアクションにアクセスしたときのテストを追加する。
test/controllers/users_controller_test.rb
test "should redirect following when not logged in" do get :following, id: @user assert_redirected_to login_url end test "should redirect followers when not logged in" do get :followers, id: @user assert_redirected_to login_url end
この実装には1つだけトリッキーな部分があります。それはUsersコントローラに2つの新しいアクションを追加する必要があるということです。
followingアクションとfollowersアクション追加しときましょう。
app/controllers/users_controller.rb
class UsersController < ApplicationController before_action :logged_in_user, only: [:index, :edit, :update, :destroy, :following, :followers] : def following @title = "Following" @user = User.find(params[:id]) @users = @user.following.paginate(page: params[:page]) render 'show_follow' end def followers @title = "Followers" @user = User.find(params[:id]) @users = @user.followers.paginate(page: params[:page]) render 'show_follow' end
renderで呼び出しているビューが同じである理由は、このERbはどちらの場合でもほぼ同じであり、リスト12.26で両方の場合をカバーできるためです。
1つのビューで両方のページをカバーできるんだ。
それぞれのアクションでフォローしているユーザー一覧とフォロワー一覧を設定するから1つのビューでいけるのかな。あとタイトル。
app/views/users/show_follow.html.erb
<% provide(:title, @title) %> <div class="row"> <aside class="col-md-4"> <section class="user_info"> <%= gravatar_for @user %> <h1><%= @user.name %></h1> <span><%= link_to "view my profile", @user %></span> <span><b>Microposts:</b> <%= @user.microposts.count %></span> </section> <section class="stats"> <%= render 'shared/stats' %> <% if @users.any? %> <div class="user_avatars"> <% @users.each do |user| %> <%= link_to gravatar_for(user, size: 30), user %> <% end %> </div> <% end %> </section> </aside> <div class="col-md-8"> <h3><%= @title %></h3> <% if @users.any? %> <ul class="users follow"> <%= render @users %> </ul> <%= will_paginate %> <% end %> </div> </div>
“following”をとおって描画したビューを図12.16に、“followers”をとおって描画したビューを図12.17に示します。
サーバーを起動して
$ rails server -b $IP -p $PORT
フォローしているユーザーページとフォロワーページにアクセス。
表示されたー。
このとき、上のコードではカレントユーザーを一切使っていない点に注目してください。したがって、他のユーザーのフォロワー一覧ページもうまく動きます (図12.18)。
確かにカレントユーザー使ってないね。他のユーザーのページもちゃんと動く!
今日の学習時間は【29分】。
次は「12.2.3「フォローしているユーザー」ページと「フォロワー」ページ」の統合テストを書くところから。