AngularJS Bower Integration Hello World

AngularJS Bower Integration Hello World

In this demo I will show you how to integrate AngularJS and Bower and finally we will create sample Hello World page. Please follow steps below:

Below are needed:

  • Install Node.js using this tutorial: NPM is default packaing manager for Node.js.
  • Install git for window using this tutorial which will be use to install Bower from git.
  • Once installation path setup properly then create static project name: AngularJSBower with below folder and files:

AngularJS Bower Integration Hello World

  • Now open command prompt and cd to project WebContent folder as below:

AngularJS Bower Integration Hello World

  • Because we already install Node.js and Git for window. Let’s check if both are available in path or not using below command:

AngularJS Bower Integration Hello World

  • Install bower globally using below command:

AngularJS Bower Integration Hello World

  • Install AngularJS package using bower using below command:

AngularJS Bower Integration Hello World

  • Refresh your project you will see below folder got created:

AngularJS Bower Integration Hello World

  • Add <script> to HelloWorld.htm page as below:

  • helloWorldController.js:

  • Now run the code you will below output:

AngularJS Bower Integration Hello World

  • For more information on AngularJS please visit angularjs website here
  • For bower visit their web site here

Leave a Reply

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