instagramのクローンアプリを作る③

##はじめに
タイトルの通り、簡易版instagramのアプリを作っていきます。
下記の工程に分けて記事を執筆していきますので、順を追って読んでいただけたらなと思います。

①アプリ作成〜ログイン機能の実装
②写真投稿機能の実装　
③[ユーザーページの実装]
(https://qiita.com/maca12vel/items/c716702b02f977303011)　←イマココ
④[フォロー機能の実装]
(https://qiita.com/maca12vel/items/2760d33f3683fac91de5)
⑤投稿削除機能の実装

##Users Controllerを作成・編集する
今更ですが、命名規則としてモデル名は単数形、コントローラ名は複数形です。
今回はコントローラ名なのでusersと複数形にしています。
※以下、アプリケーションのディレクトリで

rails g controller users

ルーティングの設定も忘れずに行います。

routes.rb

Rails.application.routes.draw do
  root 'homes#index'

  devise_for :users

  resources :photos
  resources :users # ←ここ
end

設定できたら、users_controller.rbを編集します。

users_controller.rb

class UsersController < ApplicationController
  def show
    @user = User.find(params[:id])
  end
end

showアクションでユーザーを一覧表示するようにしました。

##viewファイルを編集する
前回の記事で、ホーム画面で投稿された画像とテキストを見られるようにしていましたが、
今回は各ユーザーのページ内で投稿内容が見られるように編集していきます。

ます、ユーザーページの作成から。
app/views/usersにshow.html.erbを作成し編集します。

app/views/users/show.html.erb

<h3><%= @user.email %></h3>

<% @user.photos.each do |photo| %>
  <div>
    <p><%= photo.caption %></p>
    <%= image_tag photo.image %>
  </div>
<% end %>

@user.emailはユーザー名の代わりです。
そして、前回 投稿内容の表示を
<% current_user.photos.each do |photo| %>
としていたところを
<% @user.photos.each do |photo| %>
としました。

もちろん、ホーム画面に表示させていた投稿内容は削除します。

app/views/homes/index.html.erb

<h3>home</h3>

<div>
  <%= link_to 'logout', destroy_user_session_path, method: :delete %>
</div>

<div>
  <%= link_to '写真投稿', new_photo_path %>
</div>

#　↓↓↓↓↓↓↓↓↓↓↓↓↓↓ ここから下を削除 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓

<% current_user.photos.each do |photo| %>
  <div>
    <p><%= photo.caption %></p>
    <%= image_tag photo.image %>
  </div>
<% end %>

削除したら、各ユーザーのページへのリンクを表示させます。

app/views/homes/index.html.erb

<h3>home</h3>

<div>
  <%= link_to 'logout', destroy_user_session_path, method: :delete %>
</div>

<div>
  <%= link_to '写真投稿', new_photo_path %>
</div>

#　↓↓↓↓↓↓↓↓↓↓↓↓↓↓ ここから下を追加 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓

<% User.all.each do |user| %>
<div>
  <%= link_to user.email, user_path(user) %>
</div>
<% end %>

メールアドレスをユーザー名の代わりにしています。
user_path(user)の部分はrails routesのPrefixを確認。
今回は**userのid**も識別する必要があるので、(user)が必要です。
※user_path(user)の部分を[user]としても同じです。

ホーム画面が以下のようになっていれば成功です。

実際の挙動はこのようになっています。

[e-mail]のページへアクセスすると、
一番上にユーザー名、続いて投稿内容が表示されています。

[e-mail]のページへアクセスすると、
まだ投稿されていないのでユーザー名のみ表示されています。

ちなみに、ログインしていない状態でも各ユーザーのページにアクセスできるように、
users_controllerにbefore_action を設定していません。

---

以上です。お疲れ様でした。

次へ → ④[フォロー機能の実装]
(https://qiita.com/maca12vel/items/2760d33f3683fac91de5)