Setting up Bootstrap in Angular

Instead of using Material in Angular, we can choose to use Bootstrap to style our pages. Adding support is a simple enough task. We begin, as always, by installing the relevant packages. In this case, we are going to install Bootstrap:

npm install bootstrap --save

Once we have installed Bootstrap, we simply need to add a reference to our Bootstrap to our styles section in angular.json, as follows:

"styles": [
"src/styles.scss",
"node_modules/bootstrap/dist/css/bootstrap.min.css"
],

With this in place, we are going to create a navigation bar that will sit at the top of our page:

ng g c components/navigation

Before we add the navigation component body, we should replace the content of our app.component.html file so that it is serving up our navigation on every page:

<atp-navigation></atp-navigation>
<router-outlet></router-outlet>

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.17.174.239