Habilelabs-Logo
Blog

Start Angular 2 with TypeScript for Beginners

April 6th, 2017 . 2 minutes read
Blog featured image

I will explain how to use Angular 2 with TypeScript to build a simple application. It is Getting Started for beginners with Angular2.

Angular.js is a client side javaScript framework for creating single page application(spa). single page means it loadki one time and after that, it changes the content of page dynamically. Angular use for creating a responsive web application.

Key Features of Angular 2-

Angular 2 have four major key features, these are:

1. Component

A component encapsulates the data and template of the app and changes the behavior of the view.in angular app has a root component and root component can consist of n number of component. a component can be reused within a project or we can use it in another project.

Ex-

2. Services

services use for business and data access with API and configuration. It just a simple plain class. And we can use it again and again in our app because it’s reusable. we can use service by injecting it in any controller.

3. Routes

Routes are used for navigation. A user can navigate from one page to another page and from routing, figure out the state and what component present to the user.

4. Directives

The directive is used to extend and modify the behavior of DOM element. In angular, there are a couple of built-in directives and if we want to create a new directive with custom behavior then we can create our custom directives.

Steps for Running First Angular 2 App-

  1. Install node.js in your machine. You can download node from the following URL.

www.node.org

2. Run the following command for installing typescript in your machine

npm install -g typescript

3. Run the following command for installing typings in your system. Typings is used for bringing JavaScript library into typescript

npm install -g typings

4. Run the following command for starting code in our app

npm install angular-cli -g

5. Run the following command for creating project

ng new project-name(i.e myApp)

After creating app successfully we need to run our app by the following command

npm start

Your first angular 2 app is running now.

If you have any query in mind then ask in comment box.

Hope you enjoyed this post, don’t forget to share it with your friends!

Author: prashant
Share: