Angular Installation Guide - 3 Steps (Mac, Windows, Linux)
Here is a simple Angular installation guide which is suitable for Windows, Mac and Linux. 2 most important angular tools are nodejs and angular-cli. But 1 important point here is to install the correct version of nodejs. You will also see how to do proper angular cli project setup and prepare the generated project for future use.
Introduction
Hi I'm Oleksandr Kocherhin from monsterlessons-academy, where I'm teaching you how to become a developer or improve your skills of being a developer. And if you are new here don't forget to subscribe and I will link everything that I'm mentioning in the description.
Just to remind you this video is part of the free angular for beginners series So let's get started.
Content
First this that you need is to install node on your machine. I already have it but if you don't just go to https://nodejs.org and download it there. I always recommend to take LTS version which means "Long term support". To check that your node is available and is correctly install just write in console
node --version
If you can some number then it's fine. For Angular you node version should be between "node": ">=10.13.0 <13.0.0". How do I know this? It's not written somewhere so the best place to check it is in package.json inside angular-cli.
And now the question is "What is angular-cli" and why do we need it. So angular-cli as a part of Angular which helps us to work with it from command line. So we can create new angular project, generate components and do a lot of other stuff.
This is the first this that we need to install. Let's just in Angular cli website so you can see where it's coming from.
First of all we need to install angular-cli globally.
npm install -g @angular/cli
Now we can you ng in console to generate a project. Let's create our project
ng new angular-for-beginners
at this moment angular-cli will create a project and download all dependencies for it. To start our project we need to go in the folder and run
ng serve
Now in browser on localhost:4200 we can see our generated project.
Now let's have a look of the fine structure of our project to at least understand how this generated page is rendered. The most interesting folder for us is src/app. We are interested now in app.component.html. As you can see inside we have almost normal html. Let's remove everything and just write
<h1>Hello Angular</h1>
As you can see in browser our page is automatically reloaded and we need the changes that we make. This means that our project is working and we are prepared for writing the code.
Call to action
Now you know how install Angular on your machine but there are 2 more tools that are optional but I highly recommend them for writing code. They are prettier for code formatting and language server protocol for autocomplete, autoimport and other typescript support. As this are two bigger topics I will leave links for my videos about them in the description.
If angular for beginners is too easy for you or you want more advanced stuff check my 14 hours Angular course where we create a real project from beginning to the end. Link is also in the description.
If you find this video helpful, don't forget to subscribe to this channel and hit subscribe button. And I see you in my next video.