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