Getting started with Angular

getting started with angular

Pre-requisites ๐Ÿ˜‡

๐Ÿ‘‰ node & npm i.e. node package manager
๐Ÿ‘‰ angular/cli i.e. command line interface for Angular
๐Ÿ‘‰ Code editor/IDE i.e. VS CodeSublime or any you prefer

๐Ÿค” If you don’t have these installed in your machine, let’s quickly get it installed.

– installing node & npm ๐Ÿ‘

  1. for Windows:
    download link to node binaries
  2. for Ubuntu/Linux or MacOS:
    select your OS to get command
  3. command for installation using package manager through terminal

Node.js v14.x:

# Using Ubuntu
curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -
sudo apt-get install -y nodejs

Verify with the below commands that node and npm fire below commands

# Using Ubuntu
node -v
npm -v

– Let’s get your hand dirty ๐Ÿ–๏ธ

Now, we have our npm (node package manager) installed, we can use it to install Angular in our system.
Use below command to install Angular CLI

npm install -g @angular/cli 

OR 

#for specific version, use below command
npm install -g @angular/cli@6.1.3

#this will install specific version of Angular 6.1.3

verify ifย Angular CLIย is installed successfully, fire below command

ng v

it must look something like below:

– Now, we will create our first Angular project

We need to fire below command in our terminal/command prompt to create our project

ng new angular-app

Here, ng new is used to create new project and angular-app is your Angular project name.

It will create Angular project with default template provided by Angular itself. To have a quick look on it, we can goto our browser and visit default url served by Angular i.e. http://localhost:4200

Now, we need to point our terminal to Angular project, to achieve this use this command

cd angular-app

As of now, we are in our Angular project folder. We can use below command to serve our application to the browser

# to just serve and visit http://localhost:4200
ng serve

# to serve it on it's default browser
ng serve -o

Wow ๐Ÿคฉ, we just created an Angular application. It was super easy, isn’t it.

– Find the helping visuals ๐ŸŽฌ below here:


We are open for contribution ๐Ÿค CodeCasm


โค๏ธ Happy coding โค๏ธ


Leave a Reply

Related Post

%d bloggers like this: