Angular for Newbies III
Tags: angular, javascript, beginners, webdev
Published: 2021-12-23 16:08:56

glad to post the third post of angular newbies series 
to day we are going to talk about how to initialize angular project,
along the way i will cover a lot of topics that i cant cover in one post like release cycle of the angular and so on.

## Installing Angular CLI
to create new angular project you need to install globally on angular cli !

🤔 But wait what is Angular CLI ?? 

**Angular CLI** : Angular command-line interface is where we put / write commands that executes our command,
and don't worry i will cover Angular CLI in another series Promise ! 😀 

**SO HOW DO WE INSTALL ANGULAR CLI ON OUR MACHINE**
to install angular CLI you need to have 

- Node installed on you machine 
if go to this link and [download node](https://nodejs.org/en/) 
- And Code Editor, i will use [vscode](https://code.visualstudio.com/) choose your favorite editor 

after you successfully installed  open your CMD / terminal / power shell depends on your operating system then type the following command

```
npm install -g @angular/cli
```
it will installed angular CLI Globally and **npm** is a package manager for the JavaScript programming language maintained by npm

after successfully installed now we are ready to rock and roll 🙋‍♂️ Yeeeeey !

now let's setup our Angular Project, go to your desired  destination / folder and open with terminal then type the following command 

```
ng new your-Porject-Name 
```
that simple commnad genertes the angular project for us 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2mbhwgdn6fg05hgq23vy.png)

then asks you if you would like to add angular routing just choose no! will add it manually later,

![Terminal Screenshot for choosing the style](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/evkowcgulg7x9r5xxvrm.png) 

then asks you your preferred sylesheet just choose what ever you like css or other option i personlly like SCSS

wlaaaaah ! you made you first Angular Project 

Congratulations 🎊 🎊 🎊

then let's See He Generates for Us 

![vscode screenshot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1870421kwh5cojccsvr9.png)

as you see that simple command generated for a bunch of files

DON'T BE AFRAID 😰 

it is simple let see what each one is and what is do okay ...

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t5gj8l2687n0s24202gz.png)

here are the folders and files inside our project 

**1. node_modules** : is where all our libraries and their libraries store and please don't edit them manually 

**2.src** this is our main folder where we edit delete and all the magic here like creating components, services , modules and so on this is where 99.99% work happens 

**3. browsersliststrc** this files holds the list of browser that our application support and is used by the build system to adjust javascript and css output to support our listed browsers there  **again you dont need to edit this file**

**4. editorconfig** this file holds the editor configuration it helps maintain consistent coding styles for multiple developers working on the same project across various editors and IDEs 

**5. gitignore**  this file holds the list of items,files,folders that wont upload/save to the GIT

**6. angular.json ** provides workspace-wide and project-specific configuration defaults for build and development tools provided by the [Angular CLI](https://angular.io/guide/workspace-config). 

**7. karma.conf.js** it holds the karma configurations and it is used for testing , to test it you app

**8. package.json & package-lock.json** these files are provides us a starter set of packages, some of which are required by Angular and others that support common application scenarios.

**9. the other three files** are files that configure the typescript since angular uses typescript 

Heeey you see easy isn't it so dont worry you will adapt these files and you will be expert soon enough Promise.

hey that is it today you did an amazing job 

see you buddy 🖐 and stay health and please if you find this useful please share it to the others 

thanks