0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Railsアプリに「いいね機能」を実装

Posted at

背景

オリジナルアプリに実装する機能としてよくあるもの1つが「いいね機能」です。
自分自身で調べて実装したもの復習用になります。初学者のため間違っている部分もあるかと思います。
そのような時は優しく指摘していただけると幸いです。

準備

基本的な写真投稿サイトのアプリを「user」と「post」モデルを使用し作成してあります。

手順

###### 「いいね」を記録するためにlikeモデルを作成
rails g model likeを実行し、できたマイグレーションファイルにuserとpostを参照するための外部キーreferences型を用いて記述します。

app/db/migrate/YYYYMMDDHHMMSS_create_likes.rb
class CreateLikes < ActiveRecord::Migration[6.0]
  def change
    create_table :likes do |t|
      t.references :post, foreign_key: true
      t.references :user, foreign_key: true
      t.timestamps
    end
  end
end

データベースに反映させるためrails db:migrateを実行します。
likeモデルにバリデーションと各モデルとの紐付けを行います。

app/models/like.rb
class Like < ApplicationRecord
  with_options presence: true do
    validates :user
    validates :post
  end
  belongs_to :user
  belongs_to :post
end
ルーティングの設定
config/routes.rb
Rails.application.routes.draw do
<省略>
  resources :posts do
    resources :likes, only: [:create, :destroy]
  end
<省略>
end
likesコントローラーを作成

今回は手動でコントローラーを作成し、createとdestroyの2つのアクションを定義します。

app/controllerss/likes_controller.rb
class LikesController < ApplicationController
  def create
    @like = Like.new(user_id: current_user.id, post_id: params[:post_id])
    @like.save
    redirect_to("/posts/#{params[:post_id]}")
  end
  def destroy
    @like = Like.find_by(user_id: current_user.id, post_id: params[:post_id])
    @like.destroy
    redirect_to("/posts/#{params[:post_id]}")
  end
end
ビューファイルに表示

いいねボタンを作成し、既にいいねしたユーザーかどうかによって切り替える記述にします。

app/views/posts/show.html.erb
<省略>
<% if Like.find_by(user_id: current_user.id, post_id: @post.id) %>
  <%= link_to "いいね済み", post_like_path(@post), method: :delete %>
<% else %>
  <%= link_to "いいね!", post_likes_path(@post), method: :post %>
<% end %>
<省略>
いいね数をカウントする

whereメソッドとcountメソッドを使用し、いいねの数をカウントします。
@like_count = Like.where(post_id: @post.id).count
今回はpostsコントローラーのshowアクション内に定義しました。

表示する際にはビューファイルに<%= @like_count %>を配置すれば完了です。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?