Watch Install Dependencies Angular Video Tutorials & Courses

Music credits : https://www.bensound.com/ Github repo link for this video - https://github.com/outOfOfficeCode/AngularVideo4BootstrapIntegration Bootstrap official website - https://getbootstrap.com/ Visual Studio Code official website - https://code.visualstudio.com/ Angular cli - https://cli.angular.io/ Angular official website - https://angular.io/ Video Links Angular Tutorial part 1 playlist - https://www.youtube.com/playlist?list=PLZdPgkRI3ruhsIqV7Cr5hxjAyNirV9Jr0 Angular playlist - https://www.youtube.com/playlist?list=PLZdPgkRI3ruiOnkAoA7UGi_ueg4PuB8qB Check out other videos on our channel & Don’t forget to subscribe. Transcript Hi, Today we will integrate the bootstrap css framework into an angular application. Bootstrap is very popular and whether you are working for your company project or freelancing or maybe you just want to try out building a website for fun, it is highly recommended you use bootstrap to make things easier. You will find the official link in the description below. To use bootstrap we need to install it using the node package manager. We have discussed in the previous videos that package.json is where we define what dependencies needs to be installed in our application. The advantage this has is that when pushing code to a source control like github we need not store extra files coming from the dependencies. we only push the updated package.json and not the node modules folder which has the dependency files. If you are wondering how that happens then check the gitignore file. when we pull the code to our local machine or a server we use npm install to get those dependencies again. I will provide a github repo link as well to help you compare your code with mine in case you are stuck, so make sure you do npm install before running the application using ng serve. when we write npm install it will check package.json and get all dependencies. To get a specific dependency like bootstrap we will mention it explicitly like this. npm install --save bootstrap@4. the version number given using @ symbol is not mandatory and by default latest version gets installed into your local node modules. Note that save option is used to add an entry to your package.json file so that someone else pulling your code will not need to download this explicitly again since npm install takes care of all dependencies mentioned in package.json. Bootstrap gets installed inside node modules folder wherein you will find the css file in dist folder. After bootstrap is installed next thing to do is tell angular we want to use it, this config is present in the angular.json file where in the styles array we can define external global styles. we already have styles.css where we can add application level styles, we will put bootstrap before this so that if we want we can overwrite some styles in styles.css. Bootstrap is present in node modules folder, we can give the css file path in the angular json styles array. Rerun the application and if we inspect element we can see that bootstrap is added. we can put some bootstrap code and confirm if everything is fine or not. Thats it for the part 1 of the angular 9 tutorials, you can find links to other videos and important links in the description below. In the next set of videos we will be starting with the basics of angular like component, data binding etc. and we will try to understand them on a functional and code level. thats all for today, thanks. Key Highlights & Overview: Understanding <strong>Install Dependencies Angular</strong> requires clear step-by-step guidance and practical hands-on visual demonstrations. Explore curated video courses, expert walkthroughs, and detailed lesson notes today on <strong>TutorTube</strong>.