Fitur Pagination di Laravel

Oleh 5D Helmy Krisdin Garcia di 25 Sep 2025 | 13:29

5D Helmy Krisdin Garcia

Siswa

Postingan: 1

Anggota sejak: 12 Sep 2025

Introduction

Pagination adalah metode memotong data menjadi potongan kecil agar browser dan server tidak mengalami timeout atau down. Misalnya ketika kita memiliki 500 data, jika ditampilkan sekaligus halaman pada browser bisa menjadi sangat berat dan tidak user-friendly akibat load yang terlalu lama. Dengan pagination, data dapat dibagi per halaman, misal 5-10 item per page, user juga bisa klik 'next' atau nomor halaman untuk melihat data selanjutnya. Untungnya, Laravel sudah menyediakan fitur pagination bawaan sehingga developer tidak perlu membuat manual.

Setup

1. Membuat project baru (jika belum ada)

composer create-project laravel/laravel paginationproject

2. Atur koneksi database di file .env

Model & Seeder

1. Buat model dan migration untuk table posts

php artisan make:model Post -m

2. Edit file migration

Schema::create('posts', function (Blueprint $table) {
    $table->id();
    $table->string('title');
    $table->text('content');
    $table->timestamps();
});

3. Jalankan migration

php artisan migrate

4. Buat seeder untuk isi data

php artisan make:seeder PostSeeder

5. Edit file PostSeeder.php

use App\Models\Post;
use Illuminate\Database\Seeder;
use Illuminate\Support\Str;
class PostSeeder extends Seeder {
    public function run(): void {
        for ($i = 1; $i <= 50; $i++) {
            Post::create([
                'title' => 'Post ke-' . $i,
                'content' => Str::random(100),
            ]);
        }
    }
}

6. Jalankan seeder

php artisan db:seed --class=PostSeeder

Controller & Route

1. Buat controller

php artisan make:controller PostController

2. Tambah fungsi index()

use App\Models\Post;
class PostController extends Controller {
    public function index() {
        $posts = Post::paginate(5); 
        return view('posts.index', compact('posts'));
    }
}

3. Tambah route

use App\Http\Controllers\PostController;
Route::get('/posts', [PostController::class, 'index']);

Blade View

Buat file di resources/views/posts/index.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>Pagination Laravel</title>
    @vite('resources/css/app.css')
</head>
<body class="p-6">
    <h1 class="text-xl font-bold mb-4">Daftar Post</h1>
    <ul>
        @foreach ($posts as $post)
            <li class="mb-2 border-b pb-2">
                <strong>{{ $post->title }}</strong>
                <p>{{ $post->content }}</p>
            </li>
        @endforeach
    </ul>
    <div class="mt-4">
        {{ $posts->links() }}
    </div>
</body>
</html>

Jalankan Project

php artisan serve

Hasil

Index 1 (menampilkan post 1-5)

Index 10 (menampilkan post 46-50)

Catatan

Jika ada error pada line @vite('resources/css/app.css') di file index.blade.php, maka disarankan untuk melakukan instalasi dan menjalankan npm:

npm install
npm run dev

25 Sep 2025 | 13:29

0 Suka