Angular 7: Create new project using Angular 7
Angular 7, the latest version of angular has been successful to grab the attention of many users. Most of the designer has been using angular for their designing purpose so, what’s new in Angular 7 that attracts so many of designer and developer? The answer is simple:
- It provides a significant update in its Component Development Kit and Material design along with new virtual scrolling and drag and drops components.
- It has improved the overall application performance.
- Default bundle budgets have been introduced with the error if the initial bundle exceeds 5MB.
- Angular CLI can prompt users to help them make decisions with the available CLI Prompts.
- CLI documentation is included in the main Angular.io.docs.
- Also, supports content projection via slots.
Now moving on how to create the new project using this version:
In order to create a new project using angular 7 first, you need to install the latest version of nodejs. Even though you already have one installed in your computer, do install the latest version to access new features of angular 7.
You can check your node version in the command prompt by running the following code:
For downloading nodejs simply go to their site and press download as per the requirement your windows whether it's 32-bit or 64-bit. This can be shown as:
After completion of the installation, you need to install Visual Studio in your device. Try to install the latest version as it provides more features. The latest version can be downloaded from their site as:
After the installation, open visual studio and open your terminal. Enter the path where you want to install the latest version of angular as:
Now, simply run the following command to install angular 7:
>npm install -g @angular\cli
Angular 7 is then installed in the mentioned path.
You can even update your older version as:
$ ng update @angular/cli @angular/core // if you are using angular 6 or RxJS 6
$ ng update @angular/material // if you are using angular material
Now, you can create the project by simply running the following command:
ng new angular7-app
Here, the project named angular7-app is created is created in the mentioned path as:
Once the project is created, you are interrogated with certain questions as:
- Would you like to add Angular routing? - Type yes as you want to use navigation during the project.
- Which stylesheet format would you like to use? - Various styling is presented that can be chosen as desired by the designer. Since I prefer SCSS for styling, I've chosen it.
Finally, your new project is created and can be run by the given command which is opened using the browser:
>ng serve --open.
For reference, do visit:
For download:
