How to install Bootstrap 4 in Laravel 8

Admin   HTML5 - CSS   223  2021-03-12 16:23:44

Hi Guys,

 

Today,I will learn you how to install bootstrap 4 in laravel 8, We will show step bty step install bootstrap 4 in laravel 8. we will explain laravel 8 install bootstrap 4. you can see install bootstrap 4 in laravel 8. if you have question about how to use bootstrap in laravel 8 then i will give simple example with solution. you'll learn laravel 8 npm install bootstrap 4. you will do the following things for install bootstrap for laravel 8.

 

If you are beginner with laravel 8 then i am sure i can help you to install bootstrap 4 in laravel 8. it's very simple way to install using laravel ui composer package. laravel ui package add laravel 8 support.

 

Laravel ui provide way to install bootstrap, vue and react setup. they also provide auth scaffold for login and register. laravel 8 provide easy way to work with bootstrap, vue and react.

 

Here, I will give you full install for Bootstrap 4 in laravel 8 as bellow.

 

If you want to install bootstrap 4 in your laravel 8 project then install following laravel ui composer package to get command.

 

 

 

 

composer require laravel/ui

 

 

Next successfully install above package then I will ready to install bootstrap 4 with our application.

 

I can install two way, one is a simple bootstrap 4 setup install and another is install bootstrap 4 with auth. So let's see both way.

Install Bootstrap 4

 

 

 

php artisan ui bootstrap

 

 

Install Bootstrap 4 with auth

 

 

 

php artisan ui bootstrap --auth

 

 

Here we installed bootstrap, you can see your resource directory js folder.

 

You also need to install npm and run it. so let's run both command.

Install NPM

 

 

 

npm install

 

 

Run NPM

 

 

 

npm run dev

 

 

Now you can work with your bootstrap 4 in laravel 8 app.

 

You can use it as like bellow:

 

 

 

<!doctype html>

<html>

<head>

<!-- Scripts -->

<script src="{{ asset('js/app.js') }}" defer></script>

 

<!-- Styles -->

<link href="{{ asset('css/app.css') }}" rel="stylesheet">

</head>

<body>

<h1>This is example from </h1>

</body>

</html>

 

 

 

It will help you....