How To Install Bootstrap 5 or Latest into Angular 12 / Angular 13 | Bootstrap into Angular.

 Very Basic Question Every Angular Developer Comes in there mind, how to install bootstrap into Angular, Because Many Clients Prefer Bootstrap only with Angular. 

So, i thought that i should share my knowledge with you All guys.

Step 1:- You Need to Install Nodejs first into your Laptop or Pc.

Visit Nodejs Website and Download the Lastest Version of it :- Nodejs.

To Install it, it's Very Simple just download MSI file the installation file, then click on next next and finish. then close all the things and Open CMD ( click on start and write cmd or press win + r and write cmd ).

Write Command:- Node -v ( It will Show You the Version of the Nodejs and you will come to know whether your nodejs is installed or not ).

Step 2:- You need to install Angular Cli Latest One.

Very important thing before installing bootstrap into Angular we need Angular Cli ( ng commands ) into System. So, to do that open the Angular website and run that command cli command.

Command:- npm install -g @angular/cli

Just copy and paste into the cmd and enter ( it will start processing all the packages and install them into the system ).

In Case You guys faces and Issue Pls Comment Bellow i will help you for sure, Dont be Shy Ask Questions.

Step 3:- Check whether Angular is Installed or not ?

To Check Angular installed or not, type {{ ng v || ng --version }}. ng v will work on Angular 14 only and rest version ng --version.

Step 4:- Install Bootstrap 4 or 5 ( whichever latest it is )

So, here we come to end how to install bootstrap into Angular, I know you guys are excited to know, Here we go!!!.

Its Very Simple you can down my 2 Step into Angular.

- Use Bootstrap Cdn - https://getbootstrap.com/docs/5.2/getting-started/download/

- Use NPM Command:- npm install bootstrap --save or npm i bootstrap --save.

For CDN:-

- You need to copy paste the cdns shown in the bootstrap website to index.html file in Angular project ( in the head section or in body tag).

For NPM:-

- Write the command into cmd and run it.

- Copy Paste Some path into the Angular.json file in Project. 1) "./node_modules/bootstrap/dist/css/bootstrap.min.css"

2) "./node_modules/bootstrap/dist/js/bootstrap.min.js

Just Copy and paste it into the angular.json file ( See in the architect key name ).

Now, All the things are ready to go, just check it my use container class in the app.component.html file.

<div class="container">

  <h1>Hello</h1>

</div>

and Run the project By ng s or ng s -o ( o for open into a new tab ).

Note:- If you guys face any issue or are not able to install you can write in the comment section I will reach out to you and reply also. So, I feel it will be helpful to You Guys. Stay Safe and Follow NgDetails.