🐰

【Ruby on Rails】collectionルーティングを使用して、マイページに下書き・投稿済記事を表示してみた

2024/07/04に公開

2024/1からプログラミングスクールに通っている、プログラミング初学者です。
2024/6/28より自分自身のアウトプットのために、毎日投稿をしています。
初学者の投稿になるため間違い等ございましたら、優しくご指摘いただけますと幸いです。

はじめに

現在Ruby on Railsを使用し、記事投稿アプリを作成しております。
現在下書き保存機能も実装しましたので、自分の投稿を「下書き投稿」「投稿済の投稿」に分けてマイページ上で管理したく、collectionルーティングを使用して新規アクション、ビューの追加を行いました。

CRUD機能内でマイページを作成することに限度を感じていたので、改めてcollectionルーティングの便利さに気づきました。
下書き保存機能に関しては、また別記事で書けたらと思っています。
参考になりましたら幸いです。

マイページの作成

下記今回の作成したものになります。
GIF画像の「記事」の項目を押すと、「下書き記事」と「投稿記事」が表示されます。
下記画像内、枠で囲っているのが其々の記事タイトルとなります。記事タイトルを押すと、編集や削除ができる仕様です。
(CSS等いじっていないので、見にくくなっております...)

Image from Gyazo
Image from Gyazo

  • config/routes.rb
    今回は、usersルーティング配下で、collectionルーティングを使用しました。
    (最初はarticlesルーティング配下を検討しましたが、現状で既にネストが深いと感じたため、これ以上複雑にしたくなく、usersルーティング配下を選択しました。)
root 'staticpages#top'
  resources :users, only: [:new, :create] do
    collection do
      get :my_articles
    end
  end

  resource :profile, only: [:edit, :show, :update]

  resources :articles do
    resources :favorites, only: [:create, :destroy]
    resources :comments, shallow: true do
      resources :commentfavorites, only: [:create, :destroy]
    end
    end
  • app/controllers/users_controller.rb
    my_articlesアクションの前後アクションは、ユーザーの新規登録関連のアクションを記載していますが、今回は割愛しております。
def my_articles
    @draft_articles = current_user.articles.draft
    @published_articles = current_user.articles.published
  end
  • app/views/users/my_articles.html.erb
    こちらが、collectionルーティングで作成した、my_articlesアクションのビューになります。
<h1>下書き記事</h1>
<ul>
  <% @draft_articles.each do |article| %>
    <li>
      <%= link_to article.title, article %>
    </li>
  <% end %>
</ul>

<h1>投稿済記事</h1>
<ul>
  <% @published_articles.each do |article| %>
    <li>
      <%= link_to article.title, article %>
    </li>
  <% end %>
</ul>
  • app/views/shared/_after_login_header.html.erb
    ログインした後のヘッダー内で、自分の記事が見れるようにしております。
<ul tabindex="0" class="dropdown-content menu bg-base-100 rounded-box z-[1] w-52 p-2 shadow">
    <li><a><%= link_to "マイページ", profile_path, class: "text-sm font-semibold leading-6 text-slate-200" %></a></li>
    <li><a><%= link_to "記事", my_articles_users_path, class: "text-sm font-semibold leading-6 text-slate-200" %></a></li>
    <li><a>いいねした記事</a></li>
    <li><a><%= link_to 'ログアウト', :logout, data: { turbo_method: :delete }, class: 'text-sm font-semibold leading-6 text-slate-200' %></a></li>
  </ul>

以上が、今回のマイページ作成したコードになります。

そもそもcollectionルーティングとは?

Railsガイドでは、下記のように記載があります。

デフォルトで作成されるRESTfulなルーティングは7つですが、7つと決まっているわけではありません。必要であれば、コレクションやコレクションの各メンバーに対して適用されるリソースを追加することも可能です。
(中略)GETリクエスト + /photos/searchなどの(idを伴わない)パスを認識し、リクエストをPhotosコントローラのsearchアクションにルーティングします。

・7つのアクション(index, new, create, show, edit, update, destroy)以外で、アクションを追加したい時に使用する
・idを伴わないルーティングを使用したい場合は、collectionルーティング。idを伴うルーティングを使用したい場合は、memberルーティングを使用する。

Railsガイドで読み取れるのは上記が限界でした...。
他技術記事もいくつか参考にさせていただきましたが、上記内容に収まっているものが多かった印象です。
今回はログイン中のユーザーの「下書き記事」、「投稿済記事」の表示であったため、迷わずcollectionルーティングを使用しましたが、使い分けに関してはこちらの記事が非常にわかりやすかったです。

今回は簡単ですが以上になります。
ありがとうございました。

Discussion