Using Bootstrap with Angular

To create a responsive web application using Bootstrap is a popular choice,

Step 1: First Create an Angular Project

• Open the terminal or command prompt.
• Now using angular CLI and giving the following command create a new app.

ng new myFirstWebApp

Step 2: Now Install the Bootstrap

• Within the same terminal, navigate to your project folder.

cd myFirstWebApp

• Now install the Bootstrap by running the following command.

npm install bootstrap

Step 3: After the successful installation of Bootstrap we have to add Bootstrap styles to our project

• Open the src/styles.css file in your project.
• At the top of the file, add the following line to import Bootstrap's styles.

@import '~bootstrap/dist/css/bootstrap.css';

Step 4: After adding Bootstrap to your project you can test your application by running the following command.

ng serve

Now open your web app in any browser at http://localhost:4200.

Hence you successfully added Bootstrap to your project and you can use its features accordingly.