Laravel 8 Tailwind Pagination Example
Dec 11, 2021 . Admin
Hello Artisan,
Today, In this article I am going to show you an example of how to use tailwind pagination with laravel 8. this example will help you laravel create a tailwind pagination example.
In this tutorial, I will explain how to create tailwind CSS laravel 8 pagination. we will create simple and attractive pagination using tailwind CSS so follow my steps.
So, you can use this tutorial code and you can implement your laravel project.
Here, I will show you a full example of creating tailwind pagination in laravel so follow my below steps.
Step: 1 Add RouteFirst of all we put one route in one for list users with pagination. So simply add both routes to your route file.
Path : /routes/web.php<?php use Illuminate\Support\Facades\Route; use App\Http\Controllers\HomeController; /* |-------------------------------------------------------------------------- | 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! | */ // HomeController Route::get('users', [HomeController::class, 'index'])->name('users');Step: 2 Create Controller
In this second step, we will create a new Controller file to handle the request for creating a new route. In this Controller, we define two methods, index() for listing for users. this method will handle route requests. So let's create a new controller and put code.
Path : /app/Http/Controllers/HomeController.php<?php namespace App\Http\Controllers; use Illuminate\Http\Request; use App\Models\User; class HomeController extends Controller { /** * Write Your Code.. * * @return string */ public function index(Request $request) { $users = User::latest()->paginate(10); return view('user',compact('users')); } }Step 3: Create Blade File
In this step we will create user.blade.php with tailwind following folder.
Path : resources/views/user.blade.php@extends('layouts.app') @section('style') @endsection @section('content')Step 4: Create Pagination Template@endsectionLaravel 8 Tailwind Pagination Example - Mywebtuts.com
@foreach ($users as $key => $value) No Name @endforeach {{ ++$key }} {{ $value->name }} {{ $value->email }} {{ $users->links('pagination::tailwind') }}
this step we are going to use laravel custom pagination template, that's why run below command to have it.
php artisan vendor:publish --tag=laravel-pagination
Include Tailwind CSS Style using CDN inside the head tag.
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
This command will place the views in your application's resources/views/vendor/pagination directory. The tailwind.blade.php file within this directory corresponds to the default pagination view. You may edit this file to modify the pagination HTML.
Path : resources/views/vendor/pagination/tailwind.blade.php@if ($paginator->hasPages()) @endifPreview
Now we are ready to run our example so run bellow command for quick run:
php artisan serve
Now you can open bellow URL on your browser:
http://localhost:8000/users
It will help you...