Add Bootstrap in Angular - Angular (Tutorial #8)

Bootstrap is the most popular HTML and CSS framework for building responsive layouts without having a deep knowledge of CSS. So in this session, we will learn how we can add Bootstrap in Angular

There are 2 approach to use bootstrap in Angular
1) CDN : Content Delivery Network
2) Download bootstrap using npm

1st Approach using CDN :

jquery is a library of javascript and popper js is also a javascript library that helps you in positioning your HTML elements very quicky specially when you have something like notification

2nd approach of using bootstrap :

we can download all these libraries using npm command

Once dependencies get installed it will save these dependencies in node_modules folder

Now we
"styles": [
]

"scripts": [
]

Press Ctrl+C(to stop current running server) and start the server using ng serve -o command

and you can see it is working
If you liked my channel , subscribe to it and like my videos. For any queries ask you question in comment section

you can also connect with me @

[abhisheksoni]

Nisha, you are an excellent trainer with expertise in the subject. You explained such complex concepts/topics of angular effortlessly. I am a big fan of you. I watched your whole angular series and only one word, it is awesome. I have never seen such a detailed explanation of Angular Topics. You really made our life easy. Thank you so much and Hope you will continue to share your knowledge with strugglers.

[vamshichoula]

Hello everyone my name is nisha singla.. haha.. wow what a power women.. Nice understanding.m super tutorial.. easy understanding.. you are so sweet madam.. Thank you.

[shemamilton]

Teaching is awesome....nice....crystal
Upload more videos

[ardhendusekhar]

so nicely explained so clear code... thanks a lot you took this much of time for this to educate the beginner so appreciable .

[roshan-in]

Nice explanation and organised way of training.

[asifalishaik]

very good you have.... the way of teaching is very nice mam....
mam keep it up....create a video on JQuery with angular...
i hope you put video on JQuery with angular

[itismitabehera]

Very clear and easy process to understand for beginners .Thank you mam😊

[prithatasmin]

i am following your whole course.... u r awesome...

[mohammadanas]

thank for teaching me if any change is done angular.json we need to restart the execution

[letslearn]

Thanks. This is what i was looking for .

[rishukumari]

Hi, I am trying to create simple dropdown button in in Angular 8 using bootstrap3.3.7 . But that data-toggle="dropdown", its not working. could you pls help out with this.

[prabhakarpatil]

very informative video for beginner and expecting more videos pertaining on angular boot strap in angular ... i have been downloaded jqery, popper.js, and bootstrap after this i am not able to getting the file name is angular-cli.json instead of this i am getting only (angular.json) in visual studio

[suhaibrahman]

hi nisha
jus want to now can we do angular with python scripts and does this babble interpreter supports python scripts too..!!!

[brahmamgoud]

When we place script tag in angular erros may occur regarding sanitization I here somewhere is that correct

[prajwalpatil]

Thanks alot.
PS: Now in 2020, angular-cli.json is justt angular.json

[vishalgiri]

thanks .... but can u please tell us how to install or use bootstrap with "npm install bootstrap -s" ??

[rohanrvs]

What is the difference between bootstrap and ngx bootstrap?

[tukarambaghel]

I have found the error boots installation process
npm ERR!

this type of error what I do

[chinagopireddyravuri]

Can we add angular to flask_sqlalchemy for getting data into database

[venkateshyadla]

make sure if ../ is not working use only ./, for angular 6 they changed the path