I would like to use yeoman(The web’s scaffolding tool for modern webapps) and nodejs to generate webapp and setup a proper environment for your project.
Once after installation of nodejs and git(command prompt) check those version in command prompt by
node –version && npm –version && git –version && bower –version && yo –version && grunt-cli –version && grunt –version
you can update npm by npm update -g npm/npm install -g npm
First install all necessary dependencies globally by
npm install -g bower
npm install -g yo
npm install -g grunt / gulp
npm install -g grunt-cli
or simply all above in one line
npm install -g bower yo grunt-cli
Once this is done..you have to install
npm install -g generator-webapp //To scaffold a web application, you'll need to install the
This is the default web application generator that will scaffold out a project containing HTML5 Boilerplate, jQuery, Modernizr, and Bootstrap.
Once this is done you can install your own required generator(say angular generator) using yo angular-generator
Now that the generator is installed, create a directory for your new project in c:/workspace
mkdir project cd project
Scaffolding an AngularJS app
As always, before using a new generator, you must install it from npm first:
npm install -g generator-angular
npm install –global generator-angular
Hoping you are in your project folder say c:/workspace/project/
Now run all commands like npm install bower, npm install yo, npm install grunt to create all dependencies in local project folder.
If at any time any command throws error like ‘yo’ is not an internal/external command like that..you have to install those in locally..that is c:/workspace/project/. you can do that by using npm install yo (or) npm install yo –save-dev
c:/workspace/project/> yo angular
This generates an app folder in your directory where you will have all views/controllers/style etc etc
Now grunt serve will allow to run the application in localhost:9000
You may be thinking why we installed globally i.e., -g like npm install -g bower etc. This allows to install bower globally. You can check that in c:/users/username/appdata/roaming/npm
Note: appdata will be in hidden default. you have to make it visible in folder options.
With this we are done with setting environment and run your default application in localhost:9000.
If you want you can upload this repository to git and clone it anywhere. Refer this tutorial to enable git for your project.
Now lets move in working with angular material. Before you start working with..kindly refer this
use bower search angular-material to search for libraries.
Now install angular material using following command
bower install angular-material
Now you installed angular-material in your project folder. you can cross check by exploring bower_components folder. Now include this angular-material.css file in index.html.