DEV Community

Cover image for How to Use Bootstrap Pagination in Laravel Blade (Tutorial)
Saddam Hossain
Saddam Hossain

Posted on

1

How to Use Bootstrap Pagination in Laravel Blade (Tutorial)

In this tutorial, How to Use Bootstrap Pagination in Laravel Blade. we’ll build an app that seeds 10,000 movies and shows them in a paginated list using Bootstrap and Laravel Blade. You Can Learn How To Create Dynamic Apexcharts Using Larapex Charts Package in Laravel 11

Why ten thousand records you say? We seed this many movies so that the application will create plenty of pages and can verify that the performance holds up properly!

Let’s get started!

How to Use Bootstrap Pagination in Laravel Blade (Tutorial)

Step 1: Installing Laravel

Begin by creating a new Laravel project if you haven’t done so already.

To do this, open your terminal and run:

composer create-project laravel/laravel bootstrap-pagination-demo
cd bootstrap-pagination-demo
Enter fullscreen mode Exit fullscreen mode

Step 2: Creating the Model and Migration

Now, generate a Movies Model along with a migration file to define the movie database schema by running:

php artisan make:model Movie -m
Enter fullscreen mode Exit fullscreen mode

Afterwards, edit the migration file to define the ‘movies’ table schema and add:

database/migration/2023_12_03_213058_create_movies_table.php

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

return new class extends Migration
{
    public function up(): void
    {
        Schema::create('movies', function (Blueprint $table) {
            $table->id();
            $table->string('title');
            $table->string('country');
            $table->date('release_date');
            $table->timestamps();
        });
    }

    public function down(): void
    {
        Schema::dropIfExists('movies');
    }
};
Enter fullscreen mode Exit fullscreen mode

Step 3: Running the Migration

Run the migration to create the ‘movies’ table in the database:

php artisan migrate
Enter fullscreen mode Exit fullscreen mode

Step 4: Creating the Factory

Generate a factory that defines how Movie data looks like by running:

php artisan make:factory MovieFactory --model=Movie
Now, add the following code to define the structure and data of our fake movies:

database/factories/MovieFactory.php

<?php

namespace Database\Factories;

use Illuminate\Database\Eloquent\Factories\Factory;

class MovieFactory extends Factory
{
    public function definition(): array
    {
        return [
            'title' => $this->faker->sentence,
            'country' => $this->faker->country,
            'release_date' => $this->faker->dateTimeBetween('-40 years', 'now'),
        ];
    }
}
Enter fullscreen mode Exit fullscreen mode

Read More

Image of Timescale

Timescale – the developer's data platform for modern apps, built on PostgreSQL

Timescale Cloud is PostgreSQL optimized for speed, scale, and performance. Over 3 million IoT, AI, crypto, and dev tool apps are powered by Timescale. Try it free today! No credit card required.

Try free

Top comments (0)

nextjs tutorial video

Youtube Tutorial Series 📺

So you built a Next.js app, but you need a clear view of the entire operation flow to be able to identify performance bottlenecks before you launch. But how do you get started? Get the essentials on tracing for Next.js from @nikolovlazar in this video series 👀

Watch the Youtube series

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay