How to Angular Js- Create Angular Js Project

Angular Js is a complete JavaScript-based web application framework. It is used in Single Page Application (SPA) projects. SPAs are Web apps that load a single HTML page and dynamically update that page as the user interacts with the application. AngularJS is open source, completely free.

In this tutorial, we are going to learn to create an Angular js project and run it on the web browser. I recommend using WebStorm IDE and I am going to show you how to set up the developer tools for angularJS. Download the Webstorm IDE from jetbrains.com. Install the Webstorm IDE with the default configuration.

Features of Angular JS

  • Angular JS supports two Way Data-Binding, it synchronizes between the model and the view.
  • In AngularJS, the templates are just plain-old-HTML.
  • AngularJS incorporates the basic principles behind the original MVC software design pattern into how it builds client-side web applications.
  • AngularJS has a built-in dependency injection subsystem that helps the developer by making the application easier to develop, understand, and test.
  • Directives are my personal favorite feature of AngularJS.

 

Creating First Angular Js Project in WebStorm.

Here, we will learn to create an AngularJS project using WebStorm. WebStorm IDE creates an AngularJS project with the skeleton of the application. Let’s create our first Angular Js project.

In WebStorm IDE, select File>New project and select the Angular JS, enters the name of the project as per the following screenshot:

Create Angular Js project

 

Press the Create button. You will see the following sample angularJS project and directory structure created if you select AngularJS from the list.

 

Create Angular Js project
Open up the terminal window from the left bottom corner of the Webstorm and run npm start to run our application. This command downloads all the dependencies for an AngularJS project.

     npm start

 

Once NPM loads all the dependency we can find the index.html file in app directory which is the home page for our application. You can run the above application simply by the opening browser and enter the URL localhost:8000. It will open the browser loaded with our Angular JS Application.

Create Angular JS project

 

We have successfully created our first angular application using WebStorm.

Muhsin Yakkiparamban

Muhsin Yakkiparamban is the co-founder of Lauyou Learning. Muhsin holds Bachelor Degree in Civil Engineering from KMCT Calicut.

You may also like...