記事内にはプロモーションが含まれています

Laravelページネーションの完全ガイド:基本実装からカスタマイズまで

Laravelページネーションの完全ガイド:基本実装からカスタマイズまで プログラミングの疑問解決

Laravelでの開発において、データ一覧画面を作成する際に必ずと言っていいほど必要になるのが「ページネーション(ページ送り)」機能です。

大量のデータを一度に表示すると、ページの読み込み速度が低下し、ユーザーが「遅い」「使いにくい」と感じてしまう原因となります。

Laravelには、非常に強力で使いやすいページネーション機能が標準で備わっています。

わずか数行のコードを追加するだけで、洗練されたページネーションを実装できます。

この記事では、Laravelのページネーションの基本的な実装方法から、デザインのカスタマイズ、日本語化、検索条件の保持などの応用テクニックまで、最新情報に基づいて徹底的に解説します。

【著者プロフィール&本記事の信頼性】
プロフィール
  • 著者は元エンジニア
  • 大手プログラミングスクールのWebディレクター兼 ライターを経験
  • 自らも地元密着型のプログラミングスクールを運営
プロフィール詳細はコチラ
当ブログ著者
当ブログ著者
忖度は一切なし!
本気で未経験からエンジニア転職を目指すなら、
日本最大級の比較サイト「マイベスト」で【4年連続人気NO.1】となった
RUNTEQ(ランテック)一択!
【RUNTEQの特徴】
✅受講生からの評判が驚くほど良い
✅学習はハードだが未経験とは思えないほど高いスキルが身に付く
挫折させない万全なサポート体制が用意されている
✅採用面接で担当者に刺さるレベルの高い「ポートフォリオ」を作成できる
✅給付金を使えば実質約13万円という格安料金で受講できる

\ もちろん勧誘行為は一切なし! 相談だけでもOK! /

Laravelのページネーションの仕組み

Laravelのページネーションは、単にデータを分割するだけでなく、裏側で高度な処理を自動的に行っています。

この「仕組み」を理解しておくと、トラブルシューティングやカスタマイズが容易になります。

自動的なパラメータ検知とSQL構築

Laravelの paginate() メソッドは、HTTPリクエストのクエリ文字列にある ?page= パラメータを自動的に検知します。

例えば ?page=2 というリクエストが来た場合、Laravelは自動的にデータベースクエリに対して SQLの OFFSETLIMIT 句を適切に設定し、2ページ目のデータだけを取得します。

開発者が手動でページ番号を取得したり、計算したりする必要はありません。

ページリンクの自動生成

データ取得と同時に、Laravelは総件数(COUNT(*))を計算し、「全ページ数」「次のページの有無」などを判定します。

ビュー側で $users->links() を呼び出すと、これらの情報を基に「前へ」「1」「2」「3」「次へ」といったHTMLリンクを自動的に生成します。

基本的な実装方法

まずは、最も基本的なページネーションの実装手順を見ていきましょう。

1.コントローラーでの処理

データを取得する際に、get() メソッドの代わりに paginate() メソッドを使用します。
引数には「1ページあたりに表示する件数」を指定します。

// app/Http/Controllers/UserController.php

use App\Models\User;

public function index()
{
    // usersテーブルから1ページあたり10件ずつ取得
    $users = User::paginate(10);

    return view('users.index', compact('users'));
}

2.ビュー(Blade)での表示

ビューファイルでは、取得したデータのループ処理と、ページネーションリンクの表示を行います。

<!-- resources/views/users/index.blade.php -->

<div class="container">
    <h1>ユーザー一覧</h1>

    <ul>
        @foreach ($users as $user)
            <li>{{ $user->name }}</li>
        @endforeach
    </ul>

    <!-- ページネーションリンクの表示 -->
    {{ $users->links() }}
</div>

これだけで、基本的なページネーション機能が実装されます。

ページネーションのデザインカスタマイズ

LaravelはデフォルトでTailwind CSSを使用していますが、プロジェクトによってはBootstrapを使用したり、独自のデザインを適用したい場合もあるでしょう。

Bootstrapを使用する場合

App\Providers\AppServiceProvider クラスの boot メソッドで、Bootstrapを使用するように設定します。

// app/Providers/AppServiceProvider.php

use Illuminate\Pagination\Paginator;

public function boot()
{
    // Bootstrap 5を使用する場合
    Paginator::useBootstrapFive();
    
    // Bootstrap 4を使用する場合
    // Paginator::useBootstrapFour();
}

ビューをカスタマイズする場合

デフォルトのデザインを完全に変更したい場合は、ページネーション用のビューファイルをパブリッシュ(公開)して編集します。

以下のコマンドを実行すると、resources/views/vendor/pagination ディレクトリにビューファイルがコピーされます。

php artisan vendor:publish --tag=laravel-pagination

このディレクトリ内のファイルを編集することで、HTML構造やクラスを自由に変更できます。

日本語化対応

デフォルトでは「Previous」「Next」などのテキストが英語で表示されます。
これを日本語化する方法は主に2つあります。

言語ファイルを編集する(推奨)

Laravelの多言語化機能を利用して、日本語用の翻訳ファイルを作成します。

まず、言語ファイルをパブリッシュします。

php artisan lang:publish

次に、lang/ja/pagination.php ファイルを作成(または編集)し、以下の内容を記述します。

// lang/ja/pagination.php

return [
    'previous' => '&laquo; 前へ',
    'next' => '次へ &raquo;',
];

config/app.php'locale' => 'ja' 設定も忘れずに行いましょう。

ビューファイルを直接編集する

先ほどパブリッシュした resources/views/vendor/pagination 内のファイルを直接編集し、テキストを書き換える方法もありますが、多言語対応の観点からは言語ファイルの利用をおすすめします。

検索条件(クエリパラメータ)を保持する方法

検索フォームとページネーションを組み合わせる場合、ページ移動時に検索条件がリセットされてしまう問題がよく発生します。

これを防ぐには、appends() メソッドまたは withQueryString() メソッドを使用します。

withQueryString() を使用する(推奨)

現在のリクエストに含まれる全てのクエリパラメータを自動的にページネーションリンクに追加します。

{{ $users->withQueryString()->links() }}

appends() を使用する

特定のパラメータのみを追加したい場合に便利です。

{{ $users->appends(['sort' => 'votes'])->links() }}

高度な使い方:simplePaginateとcursorPaginate

状況に応じて、paginate() 以外のメソッドを使い分けることで、パフォーマンスやUIを最適化できます。

simplePaginate()

「前へ」「次へ」のリンクのみを表示する簡易的なページネーションです。

総ページ数を計算しないため、paginate() よりも高速に動作します。

$users = User::simplePaginate(10);

cursorPaginate()

無限スクロールの実装などに適した、最も高速なページネーションです。

OFFSET 句を使用せず、カーソル(ポインタ)を使用してデータを取得するため、大規模なデータセットでもパフォーマンスが低下しません。

ただし、ページ番号の表示はできません。

$users = User::cursorPaginate(10);

ページネーションが「できない」「おかしい」時のチェックリスト

実装したはずなのにページネーションが動かない、表示がおかしいという場合によくある原因と解決策をまとめました。

links() メソッドが存在しないエラーが出る

【現象】
 Call to undefined method ...::links() というエラーが表示される。

【原因】
コントローラーで paginate() ではなく get()all() を使っていませんか?

【解決策】
 get() はコレクション(Collection)を返しますが、paginate() はページネーター(LengthAwarePaginator)を返します。
必ず paginate() を使用してください。

// NG
$users = User::all(); 
// OK
$users = User::paginate(10);

ページネーションのデザインが巨大に表示される(崩れる)

【現象】
「前へ」「次へ」などのリンクが巨大な縦並びで表示される、あるいはスタイルが全く当たっていない。

【原因】
LaravelのデフォルトはTailwind CSSですが、プロジェクトにTailwindが導入されていない、もしくはBootstrapを使っているのに設定が足りていません。

【解決策】
Tailwindを使っている場合は、npm run build (または dev) を実行しているか確認してください。

Bootstrapを使っている場合は、AppServiceProviderPaginator::useBootstrapFive() を宣言しているか確認してください。

2ページ目に移動すると検索条件が消える

【現象】
検索後に2ページ目をクリックすると、検索条件がリセットされて全件表示に戻ってしまう。

【原因】
ページネーションのリンクに現在のクエリパラメータが含まれていません。

【解決策】
ビュー側で {{ $users->withQueryString()->links() }} を使用してください。

2ページ目以降が表示されない(404エラー)

【現象】
1ページ目は表示されるが、2ページ目のリンクをクリックすると404エラーになる。

【原因】
ルート定義にページ番号を必須パラメータとして含めている可能性があります。

【解決策】
ページネーションはクエリパラメータ(?page=2)で動作するため、ルート定義(web.php)を変更する必要はありません。
ルート定義を確認し、余計なパラメータ指定がないかチェックしましょう。

Laravelのスキルを高める最適な方法

以上、Laravelのマイグレーションについて、サンプルコード付きで詳しく解説してきました。

なお、マイグレーションを含むLaravelの理解を深めるためには、プログラミングスクールの利用が最適です。

「趣味程度でLaravelを学んでいる」「すでに現役エンジニアとして働いている」という場合には不要ですが、これからエンジニアを目指すためにLaravelを学ぼうとしている方にとっては、プログラミングスクールに通う恩恵が非常に多いです。

  • 独学とは比較にならない高いスキルが身に付きやすい
  • いつでも現役エンジニア講師に質問できる
  • 自分と同じようにプログラミングを学ぶ仲間とのコミュニティに参加できる
  • エンジニア面接の肝となる「ポートフォリオ」の作成を支援してもらえる
  • 転職支援を行なっているスクールも多い

Laravelは、PHPとセットで学ぶことがほとんどですので、もしスクールの利用を検討する場合は、以下のようなPHPに強いプログラミングスクールをチェックしてみるとよいでしょう。