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.



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 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 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 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