Rails kaminari를 이용한 Pagination기능 추가

Posted by negabaro kim on Tuesday, May 15, 2018 Tags: rails gem   3 minute read

kaminari라는 gem을 이용해서 레일즈에서 Pagination기능구현 하는법을 정리해봤다.

Pagination이란 게시판에 100개의 글이 있을 경우 이글을 페이지 번호를 매겨 보기쉽게 표시하는 기능이다.

image

사전에 rails로 퀴즈어플 만들어보기(CRUD편)에서 만든 WritingQuiz모델의 index.html.erb에 이Pagination기능을 넣어보기로 하자.

kaminari Gem추가후 bundle install

kaminari는 Rails에서 간단히 Pagination기능구현을 하기위해 사용되는 유명한 Gem이다.

# Gemfile
gem 'kaminari'

컨트롤러 수정

지금까지 WritingQuiz.all를 이용해서 전체 데이터를 가져왔었는데 해당 설정을 커맨트하고 이하 page메소드에 params[:page]를 얹혀서 보내준다.

뒤에서 알았지만 xx.all과 동일한 데이터를 취득 가능했다.

#app/controllers/writing_quizzes_controller.rb
  def index
      #@wquizzes = WritingQuiz.all
      @wquizzes = WritingQuiz.page(params[:page])
  end

뷰 설정(인덱스 페이지에 페이지네이션 설정 추가)

뷰에서는 이하 2개의 설정을 추가해준다.

 <%= page_entries_info @wquizzes %>
 <%= paginate @wquizzes %> #페이지네이션링크를 추가하는부분
#app/views/writing_quizzes/index.html.erb
<div class="main posts-index">
 
  <div class="container">
    <%= page_entries_info @wquizzes %>
    <% @wquizzes.each do |w| %>
      <div class="posts-index-item">
        <div class="post-left">
          <%= link_to w.id , writing_quiz_path(w.id) %>
        </div>
        <div class="post-right">
          <div class="post-user-name">
           문제: <%= w.question %>
          </div>
          정답: <%= w.answer %>
        </div>
      </div>
    <% end %>
    <%= paginate @wquizzes %>
  </div>
</div>

여기까지만 설정이 끝나고 Rails를 기동해준다.

<%= paginate @xx %>

<%= paginate @wquizzes %>

설정에 의해 이하와 같은 페이지네이션 링크가 추가된걸 알 수 있다.

image

page_entries_info란

<%= page_entries_info @wquizzes %>

뷰에서 추가한 위 설정으로 화면 상단에 이러한 페이징정보를 표시할 수 있다.

image

kaminari view커스텀

기존의 kaminari화면을 커스텀할때 이하 커맨드를 실행하면

rails g kaminari:views default

app/views/kaminari이하에 템플릿파일이 생성되므로 해당 부분을 커스텀 가능하게 한다.

kaminari커스텀 설정

rails g kaminari:config
      create  config/initializers/kaminari_config.rb

코맨트 되있는 부분이 디폴트 설정이다. 해당부분을 코맨트 아웃하고 수정하면 설정이 변경된다.

# config/initializers/kaminari_config.rb
Kaminari.configure do |config|
  # config.default_per_page = 25 # 1페이지당 항목수
  # config.max_per_page = nil    # 1페이지당 최대수
  # config.window = 4            # ex 값이 2일 경우 .. 2 3 (4) 5 6 ..
  # config.outer_window = 0      # ex 값이 2일 경우 .. (4) .. 99 100
  # config.left = 0              # ...로 표시될때 왼쪽 표시숫자
  # config.right = 0             # ...로 표시될때 오른쪽 표시숫자
  # config.page_method_name = :page # 메소드명
  # config.param_name = :page    # pagination의 파라메터 명 
end

모델별 설정

config/initializers/kaminari_config.rb 부분을 수정시에는 Rails프로젝트 전체에 적용되는데 이하와 같이 특정 모델에게만 적용하는 설정도 가능하다

#app/models/writing_quiz.rb

class Shop < ActiveRecord::Base
  paginates_per 5  # 1페지당 5항목 표시
end

뷰 설정

#app/views/writing_quizzes/index.html.erb
...
<%= paginate @wquizzes, outer_window: 4 %>

그외

컨트롤러 설정없이 view부분만 추가해보면 어떤 에러가 나올까.

<%= paginate @wquizzes %>

이하와 같은 에러가 발생했다.

undefined method `total_pages' for #<WritingQuiz::ActiveRecord_Relation:0x007fc24ffe5ad8>

undefined method total_pages에러가 발생하는걸 봐서는 메소드명의 디폴트값은 total인것 같다.

간단히 kaminari에 대해서 알아봤다.