【2024年最新】Railsでgemのkaminariを使ったページング機能の実装

エンジニアコラム

2021.02.052024.05.14

記事内に広告が含まれています。

Railsを使って何か投稿機能のあるアプリケーションを作って投稿していると、投稿一覧ページの投稿数がどんどん増えていき、下に長い見づらいページになってしまいます。そのようなとき通常はページング機能を持たせて、一つのページに表示できる数を制限します。

今回はこのページング機能をkaminariというgemを用いて、簡単に実装する方法についてご紹介します！

kaminariを使ってページング機能を簡単実装！

この記事の目次

【gem】kaminariとは

kaminariはRuby on Railsのgemで、ページネーションを実装するためのライブラリです。kaminariを使用することで、ページネーションの実装が簡単になります。

kaminariはActiveRecordを使用して、データベースからデータを取得し、ページネーションを実現します。またソースコードなどは、GitHub上でオープンソースとして公開されています。

最初に、このkaminariをインストールします。アプリフォルダの直下にあるGemfileの最終行に、以下を記述して保存します。

Gemfile

gem 'kaminari','~> 1.2.1'

追記したら、以下コマンドを実行してkaminariをインストールします。

$ bundle install

次に以下のコマンドを実行して、kaminariの設定ファイルを作成します。

$ rails g kaminari:config

最後にkaminariを利用するテンプレート作成のために、以下のコマンドを実行します。

$ rails g kaminari:views default

kaminariを利用するには、app/views/postsフォルダのindex.html.erbファイルに、以下のヘルパーを追加します。（モデル名・インスタンス変数名などは、ご自身が命名したものに合わせて適宜変更してください）

app/views/posts/index.html.erb

<% @posts.each do |post| %>

...

<% end %>
<%= paginate @posts %>

次にapp/controllersフォルダのposts_controller.rbファイルにあるindexアクションを、以下のように記述します。

app/controllers/posts_controller.rb

def index
  @posts = Post.page(params[:page]).reverse_order
end

おそらく、今までPost.allで全データを取得するようにしていたと思います。これを1ページに決められた数のデータだけを、新しい順に取得するように変更しています。これで、ページャの実装は完了です。

ページあたりに表示させる件数は、config/initializersフォルダのkaminari_config.rbファイルを変更することで設定が可能です。1ページの表示件数はデフォルトで25件ですが、今回は10件に設定変更してみます。

config/initializers/kaminari_config.rb

Kaminari.configure do |config|
  config.default_per_page = 10
end

ここまでできたらrails sでサーバーを起動して、動作を確認してみましょう。投稿一覧ページにページング機能が実装できていることを確認できるかと思います。

以上が、kaminariを使ったページング機能の実装方法についての解説でした。アプリを作るうえで、必須の機能ではないかもしれません。しかしユーザーの使いやすさの面を考慮すると、あったほうがいいことも多いかと思います。そんな時に、ぜひ参考にしていただければと思います。

＼エンジニアになりたい初心者向けにプログラミング学習法を紹介！／

プログラミング初心者でも安心！エンジニアへの第一歩を踏み出すための3STEP学習法