Getting Started with Angular 4

Angular

Angular 4 is a client side typescript based web application framework (JavaScript Framework) developed by angular team at Google mainly for creating single page applications (or SPAs) eg: Facebook, Twitter, Gmail and so on. React, Ember, Backbone are the similar open source JavaScript Frameworks.

Before we jump into Angular 4, you must know why I skipped angularJs 1 & angular 2. Angular 2 is not just a version upgrade but rewritten of angular 1 from scratch. Angular following semantic versioning when breaking existing API should increase numberic. That is why there is no Angular 3.

I’m using Windows PC, don’t worry if you’re using different machine it will not vary too much

Why you should learn Angular

Building more complex SPAs.

Usage is growing

Requirement

NodeJS and npm

Basic knowledge in CLI.

Little bit time

1) Get NodeJS and npm

Go to the following Web page to download NodeJS and npm, pick suitable one based on your machine configuration. Install it after you’ve downloaded file.

2) Create Your Application

Launch CLI, for Windows press the hot keys windows + R on the address bar type CMD and enter.

It may take around 5-10 minutes to complete the entire process.After this, all of your command can be done using the ng prefix.

Create a new directory for your first application. You can create your app name anything with -app suffix, which is must otherwise it will throw the error like this “Project name ‘*****’ is not a supported name.”

It will take some time to creating the first project, behind the scenes it installing Npm packages.

After the successful completion it shows the messages something like that “Project ‘test-app’ successfully created”. That is ready to go for application.

3) Launch your first application.

Your project path will be C:\Users\Your Pc Name\test-app if you didn’t configured anything additionally. Your app is in CLI note it. Change the directory to your application by

then run

it automatically started on the following port http://localhost:4200

Woah, Finally you’ve created your first application with Angular.

All good.

Leave a Reply

Your email address will not be published. Required fields are marked *