[RUBY] About adding a like function

Like function in asynchronous communication

I've been having an affair with Java for a while, and when I touched a personal application (Ruby) for the first time in a while, I had a lot of memory, so I installed a like function to remember it. I implemented it while looking at various articles, so it is a memo to summarize for myself. Until you can like by associating user and article and pressing a button.

Attention ... It is an explanation from the state where the shape as an application has already been made to some extent

① Addition of model and table

Modify the migration file with rails g model favorite

Migration file

class CreateFavorites < ActiveRecord::Migration[5.2]
  def change
    create_table :favorites do |t|
      t.references :user, null: false, foreign_key: true
      t.references :article, null: false, foreign_key: true

Then rails db: migrate

Add association to model


  has_many :favorites, dependent: :destroy
  has_many :favorite_articles, through: :favorites, source: :article


  has_many :favorites, dependent: :destroy
  has_many :favorite_users, through: :favorites, source: :user


  belongs_to :user
  belongs_to :article

  validates :user_id, presence: true
  validates :article_id, presence: true
  validates_uniqueness_of :article_id, scope: :user_id

(2) Addition of controller (in addition to routing)

Add favorite controller with rails g controller favorites And add as follows


before_action :set_article, only: [:create, :destroy]

  def create
    @favorite = Favorite.create(user_id: current_user.id, article_id: @article.id)

  def destroy
    @favorite = Favorite.find_by(user_id: current_user.id, article_id: @article.id)

  def set_article
    @article = Article.find(params[:article_id])

Edit routing


  resources :articles do
    resources :favorites , only: [:create, :destroy] #Postscript

③ Edit view

Add a like button using a partial template


  = render "layouts/favorite", article: @article


.content__favorite{id: "like-#{@article.id}"}
  - if Favorite.find_by(user_id: current_user.id, article_id: article.id)
      = link_to article_favorite_path(article.id, current_user.id), method: :delete, class: "like-delete", remote: true do
        = icon('fa', 'star')
Favorite added
        = article.favorites.length
  - else
      = link_to article_favorites_path(article.id), method: :post, class: "like-create", remote: true do
        = icon('fa', 'star')
        = article.favorites.length

If remote: true is added, ajax will start when you step on the link.

④ Make the button asynchronous communication

Create and add create.js.haml and destroy.js.haml files


$("#like-#{@article.id}").html("#{j(render partial: 'layouts/favorite', locals: { article: @article })}");


$("#like-#{@article.id}").html("#{j(render partial: 'layouts/favorite', locals: { article: @article })}");

It seems that the file is reloaded when the button is pressed by referring to the id attached to the button.

After that, if you arrange the appearance of the buttons neatly, it will be completed.

Referenced articles https://qiita.com/yummy888/items/2b7708a498861e5ba733 https://qiita.com/nojinoji/items/2c66499848d882c31ffa

Recommended Posts

About adding a like function
[Rails] About implementation of like function
[Swift] A note about function and closure
A note about adding Junit 4 to Android Studio
Q & A about JDK
About the function double-java
Do something like a JS immediate function in Ruby
A note about Java GC
A note about the scope
A note about the seed function of Ruby on Rails
A private note about AtomicReference
[Rails] Implementation of like function
Create a name input function
A note about RocksDB's Column Families
[Rails] Asynchronous implementation of like function
Add a search function in Rails.
[Rails] About the Punk List function
User evaluation using the like function
About error handling of comment function
Implement a like feature for posts
Create a filtering function using acts-as-taggable-on
A murmur about the utility class
I made a simple recommendation function.
[Rails 6] Like function (synchronous → asynchronous) implementation
A little summary about typesafe config
Call a C function from Swift
Implementation of like function in Java