AngularJS Tutorial - 1 Introduction and setup

In this video we'll discuss what is AngularJS, how to use it in the web application and how to setup development environment. This tutorial is aimed for angularJS beginners.

In this AngularJS tutorial video we will discuss
What is AngularJS
Benefits of AngularJS
A simple AngularJS example demo

What is AngularJS
AngularJS is a javascript framework. Written in Javascript and developed at google. It helps to bind HTML UI to javascript objects. With angularJS we can create Single Page Applications and very interactive web sites. With angularJS you write little code and it does lots of works by itself.

AngularJS Follows the Model-View-Controller design pattern famously known as MVC pattern.

AngularJS uses declarative syntax. You only need to add them as HTML attribute and angularJS will do rest of the work.

Dependency injection is very well used in AngularJS. Dependancy injection deals with the dependancies of different components of the application. If you don't know about dependancy injection, it's OK, we'll cover it in this series.

Two way data binding is another cool feature of AngularJS. It means that your data or model is bind to your view. So any change in your view reflects in your model and vice-versa.

Testing - AngularJS gives you power to test every code component of your application. In AngularJS testing have very important place so testing first rule is applied.

We need to include AngularJS script file in html document. For that we'll visit angularJS website at angularJS.org. We'll use AngularJS 1.x.x version through out this series. There is also AngularJS version 2 available but it has many modifications in compare to 1.x version. We'll use latest stable version that is 1.5.x currently. It is a minified version. You can also use the CDN link directly in your html document. It is the recommended way in production environments. For development we'll use the downloaded local copy.
Now the first step to bootstrap angularjs in you application is to include a ng-app attribute. In angularJs these special attributes are called directives. I'll add this directive in the body tag. We'll discuss about the directive shortly in this series. So now what this ng-app directive does it that it says hey from now from this opening body tag to closing body, AngularJS will work. Let's add a span tag and say we want to print the result of 5 into 3 using angulr. So 5 into 3 equal to double opening curly braces 5 into 3 double closing curly braces and save. Now what these curly braces are? these are angularJS expression. Angulr will calculate this expression and print 15.