How do you usually set up a new project? I'd normally create my project root directory and then add a bunch of subdirectories (img, js, css, sass) and then I'd start including all of my dependencies, such as jQuery, and then include Grunt as my task manager. This doesn't take too long really, but the fact that I have to go through the same steps each time I start a new project makes me think how its kind of time wasting...and then I found Yeoman. Yeoman is just what I've been looking for in that it can do all of this for me with a single command. Amazing!

Yeoman uses three core tools for improving productivity when building a web app:

yo - creates a new webapp (yo webapp)
bower - handles dependencies (bower search, bower install)
grunt - task manager, preview, test, build (grunt serve, grunt test, grunt)

Yo

Yo is maintained by the Yeoman project and offers web application scaffolding, utilizing scaffolding templates or generators. Installation of yo and any generators is performed using npm.

Install yo and other required tools:

npm install -g yo

npm is the package manager for Node.js and comes bundled with it.

A Basic App

To scaffold a web app, you need to install the generator-webapp generator:

npm install -g generator-webapp

This is the default web app generator that will scaffold out a project containing HTML5 Boilerplate, jQuery, Modernizr, and Bootstrap. You're given a choice during the interactive prompts to not include many of these.

Once the generator is installed, create a directory for your new project

mkdir my-yo-project cd my-yo-project

and then run:

yo webapp

Each project created with yo will also pull in relevant Grunt tasks which the community feels is needed or useful for your workflow.

Basic Grunt commands can be used to create a local server in order to preview your app/site, run unit tests and build your production version.

# Preview an app you have generated (with Livereload).
grunt serve
# Run the unit tests for an app.
grunt test
# Build an optimized, production-ready version of your app.
grunt

Amazing stuff!
Next up, I'll be creating my own custom Yeoman generator.