Workflow Yeoman-Bower-Grunt

Yeoman generator for an automated PhoneGap project and build. Uses grunt-phonegap to automate platform builds and performs basic optimization tasks relevant for phonegap projects.

• 
  yo scaffolds out a new application, writing your Grunt configuration and pulling in relevant Grunt tasks and Bower dependencies that you might need for your build. Yeoman Generators
• 
  The Build System is used to build, preview and test your project. Grunt and Gulp are two popular options. Grunt Plugins
• 
  The Package Manager is used for dependency management, so that you no longer have to manually download and manage your scripts. Bower and npm are two popular options. Bower Packages

Installation

Yeoman

First things first: you'll neet (node.js installed) yeoman, bower and grunt installed. If you haven't already:

$ npm install -g yo bower grunt-cli

Yeoman works with generators. Let's use a simple one for scaffolding

$ npm install -g generator-webapp

With a generator installed, let's create a new project, called 'super-secret-project'.
Let's create a directory for the super-secret-project and then jump into it:

$ mkdir super-secret-project
$ cd super-secret-project

time to Run the App

$ yo webapp

Bower

Bower is a package manager for the web which allows you to easily manage dependencies for your projects.
It will take care of stuff like bootstrap, LESS, backbone.js.. Sort of 'a steam for libraries'.

$ bower search something-cool-here

You can install multiple dep at once. Let's say we want bootstrap, fontawesome and backbone:

$ bower install boostrap fontawesome backbone

If you want to check what's 'under your hood'

$ bower list

or you want to update to the latest version

$ bower update

Grunt

Grunt is a task-based command-line tool for JavaScript projects. It can be used to build projects, but also exposes several commands which you will want to use in your workflow.

There are 2 file important for your Grunt project:
package.json: used by npm to store metadata for projects published as npm modules. You will list grunt and the Grunt plugins your project needs as devDependencies in this file.
Gruntfile: This file is named Gruntfile.js or Gruntfile.coffee and is used to configure or define tasks and load Grunt plugins.

$ grunt serve

You can install multiple dep at once. Let's say we want bootstrap, fontawesome and backbone:

$ grunt test

Build an optimized, production ready, tested, version of your super-secret-project!

$ grunt

Let's put it all together:

$ yo webapp

	            $ grunt serve
$ grunt test
$ grunt

And If I wanted Bower too?

	            $ yo webapp

	            $ bower search xxx

	            $ bower install xxx

	            $ grunt bower

	            $ grunt wiredep
	        

Cheeeeesus!