Lets get started with AngularJS

Lets get started with AngularJS

Hi Guys, lets get started with your first AngularJS program.  Learn how are create web apps with AngularJS with step by step. Going to cover the features of AngularJS in next posts. This is the beginning of AngularJS storm.

Here you will understand the how to install and run your first HelloWorld example.

Why AngularJS:

  •  It provides structure to app
  • Easy to learn
  • Reduces the coding effort and time
  • Suitable for single page apps
  • New vocabulary for HTML markups
  • MVC pattern
  • Has more than 800 modules
  • Has own template engine
  • Read more @ https://angularjs.org/

There are some frameworks likes jQuery, BackboneJS, KnockoutJS etc. ,but angularJS has many features than others.

Read the differences between all frameworks here 

How to install AngularJS:

  • Create a new web page and include Angular library(https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.js) in it.
  • Create app.js and include in our web page.
  • Add ng-app and ng-controller to that document as shown below.


-> ng-app is the directive of AngularJS  and DOM reference to the app.

->  We create an app with the value of ng-app.

->ng-controller holds the control of our app.

->  Create a controller in app.js with with the value of ng-controller.

Your app.js will look something like this.

Scope($scope) is the glue between application controller and the view.  and its an object that refers to the application model.  All the scope values can explicitly used in view. Add our first key title and assign the value ‘Hello World!’ to it,

So, we can use title any where in the view with reference to $scope object.  Use {{}} brackets to display the contents of $scope object.

Look at the plunker  below

You will learn data bindings in next post and thanks for reading.







Free placeholders for every case


1. Online image generator

Online image Generator,Generate images for ad spaces, banner spaces, image spaces and more. Use URLs directly or download images for free.

Have a look!

1. placehold.it

A quick and simple image placeholder service.

Have a look!


Placeholder Images for every case. Webdesign or Print. It’s simple and absolutely free!

Have a look!

1. loremflickr.com

LoremFlickr provides placeholder images for every case, web or print, on almost any subject, in any size. It’s simple and free. Just put the custom url in your code.  Images are taken from Flickr.

Have a look!


A quick and simple service for getting pictures of kittens for use as placeholders in your designs or code. Just put your image size (width & height) after our URL and you’ll get a placeholder.

Have a look!



Dynamic Dummy Image Generator

Have a look!

DataWeave – Intelligent Data for your Apps

DataWeave provides data in various sectors of web like data for coupons, weather updates, population, earthquakes etc..  Gives an easy access to APIs, dashboards, alerts and visualization.


  1. Telecom Data API: Provides details of recharge coupons from various telecom operators across all circles.
  2. E-commerce price intelligence; Provides prices from various stores for the selected product, useful for comparison based websites.
  3. Coupons codes API: Provides coupon codes with their details from all online retailers.
  4. For more API features visit http://dataweave.in/apis

How to use DataWeave APIs

  • Sign up  and confirm your account with http://dataweave.in/ to access to all APIs
  • signup-dataweave





  • Grab API key from next page of sign up

How to use DataWeave API with PHP

An example usage of DataWeave APIs with PHP, here you can even use PHP cURL to parse the data.

The above code prints the data in PHP array, we can use it anywhere later.

I hope this post is helpful and thanks.


PHP function to get ID from YouTube URL

Use the following function to get the id from YouTube URL.

 How to use?

That”s all for now.