How to Properly Install and Use Bootstrap 4 in Laravel 8

In this tutorial you will learn about the How to Properly Install and Use Bootstrap 4 in Laravel 8 and its application with practical example.

In this How to Properly Install and Use Bootstrap 4 in Laravel 8 tutorial I will show you how to install bootstrap 4 in laravel 8. In this tutorial you will learn to install bootstrap 4 in laravel 8. In this article I will share example to install bootstrap 4 in laravel application.

Table Of Contents−

How to Properly Install and Use Bootstrap 4 in Laravel 8

In this step by step laravel 8 install bootstrap 4 tutorial I will demonstrate you to install bootstrap 4 in laravel 8. We will cover the following concepts of Laravel and Bootstrap:

  • How to Install Laravel/UI.
  • How to install Bootstrap and its packages
  • How to compile Bootstrap assets.
  • How to install Bootstrap Auth Scaffolding.
  • How to use complied Bootstrap CSS and JS in Laravel blade template

Laravel Bootstrap 4

Bootstrap is a CSS framework that provides user-friendly UI components to build a next-level web or mobile application.

Install Laravel Project

First of all we need to create a fresh laravel project, download and install Laravel 8 using the below command

Switch to the newly created project directory.

Install Laravel/UI

Now, switch the laravel project directory and run the following composer command to install laravel/ui package.

Install Bootstrap in Laravel 8

Run following artisan command to install Bootstrap in your Laravel project.

Install Bootstrap Auth Scaffolding

Use the following artisan command to Install the auth scaffoldings with Bootstrap.

We have successfully installed the bootstrap, and you can make sure by going to resource/js/bootstrap.js. You will see that popper.js and jQuery have been added to the bootstrap’s JavaScript file.

Install Bootstrap Packages

Now, we need to make sure we have Node installed on your local development system. Run the following command to check node installation.

Now, you need to install the bootstrap package and the related frontend dependencies such as jquery from npm using the following command:

Compile Assets

Check resources/sass folder _variables.scss and app.scss files have added along with sass variables and fonts.

Now, run the below command for asset compilation.


The above command compiles CSS and JavaScript files from resources/js and resources/sass folder to the public folder.

Automate SASS and JS Changes

Using Bootstrap in Laravel Blade Template

Now, you can use the bootstrap js and CSS in laravel blade template as following:

In this tutorial we have learn about the How to Properly Install and Use Bootstrap 4 in Laravel 8 and its application with practical example. I hope you will like this tutorial.