Rails에서 태그 게시 기능 구현 (실장편)

gem을 사용한 태그 기능 구현 (비망록)

전회에 계속해, gem 'acts-as-taggable-on'을 사용한 태그 기능의 구현편이 됩니다.

↓도입편에 대해서는 이쪽
Rails에서 태그 투고 기능 구현 (도입편)

개발 환경

Rails 버전 5.2.4.1
ruby 버전 2.5.1
acts-as-taggable-on 버전 6.0.0
데이터베이스 mySQL

구현 내용

1. 모델과 컨트롤러에 설명 추가

· 태그 기능을 구현하고 싶은 모델과 컨트롤러에 다음을 추가합니다.

content.rb

class Content < ApplicationRecord
  acts_as_taggable  #追加(acts-as-taggable-onの別名)
~
end

contents_controller.rb

class ContentsController < ApplicationController
  before_action :set_group
  def new
    @content = Content.new
  end

  def create
    @content = @group.contents.new(content_params)
    @content.user_id = current_user.id 
    if @content.save
      redirect_to group_contents_path(@group), notice: '保存できました'
    else
      @content.images.new
      @contents = @group.contents.includes(:user)
      flash.now[:alert] = '内容を入力してください'
      render :new
    end
  end

  private

  def content_params
    #tag_listをpermitに追加
    params.require(:content).permit(:text, :title, :image, :tag_list).merge(user_id: current_user.id)
  end

  def set_group
    @group = Group.find(params[:group_id])
    @users = @group.users
    @user = current_user
  end
end

2. 뷰 파일 편집 (저장 페이지)

new.html.haml

 # 略
= form_with model:[@group,@content], local:true do |f|
 # 略
  .form-contents__tag
    = f.label :tag_list
    = f.text_field :tag_list, value: @content.tag_list.join(","), class: "form-control", placeholder: 'テキストを入力してください'

공백으로 구분하려면 config/initializers 이하acts_as_taggable_on.rb를 새로 작성하십시오.

acts_as_taggable_on.rb

ActsAsTaggableOn.delimiter = ' '

이제 DB에 값이 저장됩니다!
tags 테이블의 [name] 열에 입력한 태그와 같은 이름이 있으면 레코드는 증가하지 않고 [taggings_count]의 카운트가 늘어나갑니다.

3. 뷰 파일 편집 (일람 표시 + 태그의 좁히기)

그런 다음 DB에 저장된 태그를 표시합니다.

contents_controller.rb

def index
  @contents = @group.contents.includes(:user,:tags)
  if params[:tag_name]
    @contents = Content.tagged_with("#{params[:tag_name]}")
  end
end

index 액션으로 일람표시시킵니다.
N+1 문제를 고려하여 includes(:tags)를 작성해 봅시다.
tagged_with 메서드를 사용하여 tag_name에 값이 포함되어 있으면 (태그를 클릭하면)받은 tag_name를 tagged_with("タグ名")의 태그 이름에 넣고 필터링을 수행합니다.
처리가 실행되면 동일한 tag_name을 가진 태스크가 목록에 표시되는 메커니즘입니다.

index.html.haml

# 略
  - @contents.each do |content|
    %ul.contents__left__group__content-tag
      関連タグ :
      = render 'shared/tag_list', tag_list: content.tag_list

_tag_list.html.haml

- tag_list.each do |tag|
  = link_to tag, group_contents_path(@group,tag_name: tag), class: "tag-text"

render처에서 each의 처리로 하나하나를 독립시키고 있습니다.
또한 link_to 설명에서 경로 tag_name: tag로 태그 이름을 컨트롤러에 전달하고,
tagged_with 메서드로 필터링을 곱합니다.

마지막으로

일단 태그의 좁히기 기능까지 실장했으므로, 거동 확인용의 GIF를 붙여 둡니다.
(개발 도중 개인 앱이므로 CSS 수정 등은 불가능하지만 양해 바랍니다 )
거동 확인

acts-as-taggable-on은 그 밖에도 태그의 사용 빈도로 검색을 걸거나 편리한 메소드가 있으므로, 한번 참조를 봐 주시면 좋을까라고 생각합니다!

이하, 도입편과 같이 참고로 한 기사가 됩니다.

Rails | acts-as-taggable-on을 사용한 태그 기능 구현 | 비망록
acts-as-taggable-on Git Hub
Rails 5.2에서 태그 게시 기능을 구현하기 위해 gem "acts-as-taggable-on"을 사용해 보았습니다.