Did you guys enjoy Paul Irish’s talk at Google I/O?

In case you missed it, yesterday we announced Yeoman - a project we’ve been working on to greatly help improve developer workflow, spanning everything from a comprehensive build process to package management. If you’d like to read more about it’s features, check out Yeoman.io.

How does Yeoman build upon Grunt?:

One common question we’ve been asked if how Yeoman differs from Grunt. Ben Alman’s Grunt is an excellent baseline and with this project we wanted to build on it, addressing:

An opinionated workflow we feel will simplify achieving common tasks more quickly

we feel will simplify achieving common tasks more quickly Improved scaffolding (our most basic scaffolding supports stripped HTML5 Boilerplate, Twitter Bootstrap (with Compass support) and AMD). We’re working on improving this further. You easily kick this off with yeoman init

(our most basic scaffolding supports stripped HTML5 Boilerplate, Twitter Bootstrap (with Compass support) and AMD). We’re working on improving this further. You easily kick this off with Integrated package management - on the front-end this is huge. No more having to manually go opening up your browser or GitHub to find dependencies like jQuery or Backbone. Just do yeoman install jquery or upgrade using yeoman update

- on the front-end this is huge. No more having to manually go opening up your browser or GitHub to find dependencies like jQuery or Backbone. Just do or upgrade using Wiring and integration of a number of commonly used grunt tasks (getting these to play nicely is not always straightforward)

and integration of a number of commonly used grunt (getting these to play nicely is not always straightforward) Experimental support for EcmaScript 6 module syntax (works with CoffeeScript, vanilla JS, AMD)

(works with CoffeeScript, vanilla JS, AMD) An improved watch process - Yeoman has LiveReload support and falls back to a simple watch/reloader if you aren’t using LR. We also automagically compile your CoffeeScript and Compass files whenever you change them.

- Yeoman has LiveReload support and falls back to a simple watch/reloader if you aren’t using LR. We also automagically compile your CoffeeScript and Compass files whenever you change them. A comprehensive build process including benchmarked Image optimization, app cache manifest generation and a bunch of other pieces we think you’ll find very useful

Tooling tips and Yeoman Screencast (18 mins):

In this supplemental video, I discuss some more tips for developer tooling and ways in which Yeoman (and related projects) help us spend less time on process and more time building more awesome applications.

httpv://www.youtube.com/watch?v=3s6Yv9pVXZc

tl;dr: do what you can to automate as much of your workflow as possible.

We’re looking at a number of additions we might make to Yeoman in the future, but we’re aiming to get a release out the door in the next month or so.

(Special thanks to Grunt, HTML5 Boilerplate and more without whom this project wouldn’t have been possible)

Video notes and further recommendations:

Editor

Scaffolding

Watch process

Are you still manually refreshing your apps/pages on every change? Still having to compile CoffeeScript etc. each time too? Get a file watcher in place to automatically reload for you.

LiveReload, CodeKit, Brunch and Grunt also do this well: LiveReload Grunt Brunch CodeKit

Grunt Reload tries to offer a better watch process for Grunt and also has some basic support for the LiveReload extension

Testing

Mocha Also check out: Grunt Mocha

Jasmine and of course it’s related Grunt ask: Jasmine-grunt

From Pauls talk (thanks to Ryan). Automated client-side testing in the cloud Bunnyip



Build process

We all need a solid build process for production

The basics (which Grunt covers very well): Linting Unit testing Concatenation Minification Optimization

These days there are a few more steps worth considering: Using AMD? You should be running those modules through r.js, ideally without forcing non-AMD projects to do this if you’re not using them. grunt-requirejs Headless unit testing (PhantomJS, Zombie.js) Node-Zombie Connect Socket Compile Compass, LESS, CoffeeScript files grunt-less grunt-compass grunt-coffee Image optimization (we’ve benchmarked the below two as the best) OptiPNG JPEGTran File versioning Generating an application cache manifest Confess.js helps with this greatly



Extra

Interested in automated distributed CI for JS? Checkout this guide from the jQuery project.

Thoughts?

We’ve had a great response to Yeoman since we announced it yesterday and would love to hear more about what you guys think of the idea. Do you see yourself using it based on the feature list and teaser? Anything else you wish it could try addressing?.