In Laravel, pagination refers to the process of dividing a large set of data into smaller, more manageable chunks called "pages." This is commonly used in web applications to display data in a structured and organized manner, allowing users to navigate through the data in a convenient way.
Step 1: Install Laravel App
composer create-project laravel/laravel example-pagination
Step 2: Database Configuration
.env
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=your database name
DB_USERNAME=database username
DB_PASSWORD=database passwordStep 3: Create Dummy Users
migration command:
php artisan migrateNext, run ticker command to add dummy users:
php artisan tinker
User::factory()->count(100)->create()Step 4: Add Route
routes/web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\UserController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('users', [UserController::class, 'index']);Step 5: Create Controller
app/Http/Controllers/UserController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\User;
use Illuminate\View\View;
class UserController extends Controller
{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index(Request $request): View
{
$users = User::paginate(5);
return view('users', compact('users'));
}
}
Step 6: Create Blade File
resources/views/users.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Laravel 10 Pagination Example - webthestuff.com</title>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.0.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h1>Laravel 10 Pagination Example - webthestuff.com</h1>
<table class="table table-bordered data-table">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Email</th>
</tr>
</thead>
<tbody>
@forelse($users as $user)
<tr>
<td>{{ $user->id }}</td>
<td>{{ $user->name }}</td>
<td>{{ $user->email }}</td>
</tr>
@empty
<tr>
<td colspan="3">There are no users.</td>
</tr>
@endforelse
</tbody>
</table>
<!--
You can use Tailwind CSS Pagination as like here:
{!! $users->withQueryString()->links() !!}
-->
{!! $users->withQueryString()->links('pagination::bootstrap-5') !!}
</div>
</body>
</html>
Run Laravel App:
php artisan serveNow, Go to web browser, type the given URL and see the output:
http://localhost:8000/users
