Getting started with Angular

3 min readMar 14, 2021

Angular is a TypeScript based web application framework. It is robust and amongst the most popular web frameworks open-sourced by the Angular team at Google. Angular can be used to develop applications with dynamic features, Enterprise level web apps, Single Page Applications (SPA’s), etc.

If you want to build complex client-side applications with simple animations, a lot of network calls, apps with a variety of functions and operations then Angular is a good choice. Angular can be used to make:

Enterprise Level Applications:- Angular is equipped with features like autocompletion, navigation features, Advanced-Routing system and has a hierarchical structure that is easy to maintain and understand.
Single Page Applications (SPA’s):- Component-based architecture of Angular is useful to design complex single-page apps. Angular provides faster transitions due to which the website feels more like a native app. Angular provides a wide range of tools for SPA development.
Progressive Web Applications (PWA’s):- The Angular team foresees the upcoming popularity of PWAs and is working on facilitating the process of creating PWAs. With built-in support and CLI commands enable the developers to convert their projects into progressive web apps easily.

Features of Angular:

Getting Started:

Prerequisites for getting started with Angular on your local system and starting a new Angular project.

NodeJS:

Angular requires Node version 8.x or above. You can download Nodejs from here for your OS. The installation process is clearly explained in the following videos:

For Windows

https://www.youtube.com/watch?v=qYwLOXjAiwM

For Linux

https://www.youtube.com/watch?v=EZWYMqydOw4

For macOS

https://www.youtube.com/watch?v=TQks1p7xjdI

After installation run node -v in your terminal window to check the node version.

NPM (Node Package Manager):

Angular, Vue, or any other framework of javascript has certain features obtained from the npm libraries. To include these features and add new npm packages you must have Node Package Manager. Node Package Manager is by default installed by Node. To check the version run npm -v command on your terminal window.

Install Angular CLI:

Angular CLI is used to generate Angular Application, create Projects and perform other operations such as testing and deployment using simple commands. It is recommended to install Angular CLI globally in your system, which can be done using the following command in the terminal:

npm -install -g @angular/cli

npm -i -g @angular/cli

Note: The -i flag is a short form for install and -g flag is short for global

Creating a new Project in Angular using Angular CLI use:

ng new first-app

Note: ‘first-app’ is the name of the Angular project created and ‘ng new’ is the command used by Angular CLI to initialize a new application.

Start the application:

To start the Local Server of the Angular application on the default browser, run the commands in your terminal:

cd first-app

ng serve --open

*Note:- ‘cd’ command is used for changing the directory in the terminal and ‘ng serve’ is used to start the server of the application on the default port 4200 with the hostname as localhost. ‘--open’ opens the browser to

http://localhost:4200/