Also Read: How to Use Bootstrap 4 With ReactJS
We can combine these two frameworks to quickly and easily develop amazing websites. Also, to create Bootstrap and Angular project we can use ng-bootstrap which has a set of angular directives that is based on Bootstrap which we will be discussing later in the article.
There are many websites that make use the power of Bootstrap and Angular to create stunning websites or web applications. For example, Kodable and Bizns.
How to use Bootstrap with Angular?
Let’s first create an Angular project using Angular CLI. Angular CLI is a command line tool that helps you create and scaffold angular projects easily.
Install Node.js and npm if not already installed on your computer. The install Angular CLI using the following command.
npm install -g @angular/cli
The installation may take a little time to complete. After the installation, we can use Angular CLI to create our applications. Use the following command to build a new application.
ng new myproject
Move to the folder where your application is located using the command
Now serve the application using the command
The command ng serve –open will open the browser automatically with the greeting on your browser at http://localhost:4200/ as shown.
This page is running the app.component.html file in the src/app folder in your project folder. You can open the folder and make changes to the code and the browser will automatically reflect those changes.
So, you are set up with Angular.
npm install firstname.lastname@example.org
Or you can download the source file or use CDN for Bootstrap.
If you are using CSS and JS file fro your local computer make sure that you include the file in your project folder or you have the correct path to the folder in the tag.