【Rails】furimaアプリ 商品詳細表示機能 #1

実装概要

• 商品詳細表示ページにて、商品の詳細情報を表示する

ルーティングの設定

config/routes.rb

# 中略
resources :items, only: [:index, :new, :create, :show]
# 中略

showアクションをコントローラに定義

app/controllers/item_controller.rb

# 中略
def show
  @items = Item.find(params[:id])
end
# 中略

ここでmainブランチに「ルーティングの設定」 「showアクションをコントローラーに定義」の2つをcommit&pushしてしまっていることに気づく

解決策を下記に記載していく

新しいブランチを作成

ターミナル

% git checkout -b 商品詳細表示機能

新しいブランチをプッシュ

ターミナル

% git push -u origin 商品詳細表示機能

mainブランチを2つ前のコミットに戻す

ターミナル

% git checkout main
% git reset --hard HEAD~2

変更を強制プッシュ

ターミナル

% git push --force origin main

注意点

• --hard オプションにより、コミット履歴だけでなく作業ツリーも強制的に戻されるため、変更やファイルの状態がすべて2つ前のコミット時点に戻る
• この操作は不可逆的なので、現在のコミットや作業内容が必要な場合は、実行する前にgit branchコマンドで別ブランチを作成し、バックアップを取る等の対応が必要

その後GitHub Desktopで商品詳細表示機能ブランチに変更されていることを確認し、
戻した分のcommit2つをpullして、解決することができた

index.html.erbファイル、show.html.erbファイルの作成&修正

ターミナルにてrails routesコマンドでルートを確認し、下記コードを記述

app/views/items/index.html.erb

# 中略
<%= link_to item_path(item.id) do %>
# 中略

app/views/items/show.html.erb

# 中略
<% if user_signed_in? && current_user.id == @item.user_id %>
  <%= link_to "商品の編集", "#", method: :get, class: "item-red-btn" %>
  <p class="or-text">or</p>
  <%= link_to "削除", "#", data: {turbo_method: :delete}, class:"item-destroy" %>
<% end %>

<% if user_signed_in? && current_user.id != @item.user_id%>
  <%# 商品が売れていない場合はこちらを表示しましょう %>
  <%= link_to "購入画面に進む", "#" ,class:"item-red-btn"%>
  <%# //商品が売れていない場合はこちらを表示しましょう %>
<% end %>
# 中略

商品の編集・削除ボタンは出品者のみ表示されるよう<% if user_signed_in? && current_user.id == @item.user_id %>を記述

購入ボタンはログインしている出品者以外のユーザーのみ表示されるよう<% if user_signed_in? && current_user.id != @item.user_id%>を記述

実際にログイン（出品者、出品者以外）、未ログインにて動作するか確認し、問題ないことを確認
コードレビューを依頼

修正依頼でリファクタリングが必要とのこと

リファクタリング

修正前

app/views/items/show.html.erb

# 中略
<% if user_signed_in? && current_user.id == @item.user_id %>
    <%= link_to "商品の編集", "#", method: :get, class: "item-red-btn" %>
    <p class="or-text">or</p>
    <%= link_to "削除", "#", data: {turbo_method: :delete}, class:"item-destroy" %>
<% end %>
<% if user_signed_in? && current_user.id != @item.user_id %>
    <%# 商品が売れていない場合はこちらを表示しましょう %>
    <%= link_to "購入画面に進む", "#" ,class:"item-red-btn"%>
    <%# //商品が売れていない場合はこちらを表示しましょう %>
<% end %>
# 中略

修正後

app/views/items/show.html.erb

<% if user_signed_in? %>
      <% if current_user.id == @item.user_id %>
        <%= link_to "商品の編集", "#", method: :get, class: "item-red-btn" %>
        <p class="or-text">or</p>
        <%= link_to "削除", "#", data: {turbo_method: :delete}, class:"item-destroy" %>
      <% else %>
      <%# 商品が売れていない場合はこちらを表示しましょう %>
      <%= link_to "購入画面に進む", "#" ,class:"item-red-btn"%>
      <%# //商品が売れていない場合はこちらを表示しましょう %>
      <% end %>
    <% end %>

if user_signed_in?が繰り返し使用されていたので、１つにまとめたコードに修正
商品詳細表示機能実装完了です！！
次回は商品情報編集機能に取り組んでいきます！