はじめに

記事の検索・閲覧アプリの作成中です。今回は、検索結果一覧表示が1ページで膨大な量になってしまうため、ページネーション機能を実装し、1ページに表示する数を制限して、スッキリとした見た目を実現したいと思います。

環境

Ruby on Rails '6.0.0'
Ruby '2.6.5'

前提

ユーザーが記事の検索などを行い、記事一覧が表示され、閲覧できる。

①Gemの導入

ページネーション機能を簡単に実装できるgem「kaminari」を導入します。

Gemfile

gem 'kaminari'

ターミナル

% bundle install

②コントローラーにてページネーションを定義する

app/controllers/articles_controller.rb

  def index
    @articles = Article.page(params[:page]).per(8).order('created_at DESC')
  end

「page」と「per」というメソッドがkaminariで定義されているメソッドです。perメソッドの引数にどれだけの記事（レコード）が表示されたら、ページを増やすのかを指定しています。

③ビューファイルの編集

app/views/articles/index.html.erb

(省略）
 <%= paginate @articles %>

表示したいビューファイルに上記を記述するだけで完了です！！！

おまけ(ページネーションのカスタマイズ)

上記の3工程でページネーション機能は導入できますが、ビューファイルはdefaltで決まっています。それを修正する方法について記述します。

ターミナル

% rails g kaminari:views default （①）

              or

% rails g kaminari:views bootstrap4 （②）

①のコマンドで、app/views配下にkaminariが追加されるため、そこで変更を行うことができます。
②のコマンドでbootstrapなどのCSSフレームワークを適用できます。

また、デフォルトで英語表記になっているため、日本語表記に変更するためには、config/locales以下にkaminari_ja.ymlというファイルを作成し、以下のように記述すれば適用できます。

config/locales/kaminari_ja.yml

ja:
  views:
    pagination:
      first: "&laquo; 最初"
      last: "最後 &raquo;"
      previous: "&lsaquo; 前"
      next: "次 &rsaquo;"
      truncate: "..."

おわりに

https://pikawaka.com/rails/kaminari
上記の記事を参考にしました。ありがとうございました！！

【Rails6】ページネーション機能実装（kaminari）