Improving Front-end Development with Yeoman

The front-end web stack has a plethora of tools for developing robust, scalable applications. Whether it's UI frameworks like Foundation or Bootstrap, front-end MVC frameworks like Angular, Backbone, or Ember, or production tools like RequireJS, SASS, or JSHint. The only problem is, how do you choose which technologies to go with? And once you figure that out, you still need to string them all together, managing dependencies and configuration files, etc. You could end up wasting a whole day just setting up a project before you even start writing code.

Make friends with Yeoman now and thank me later.

Yeoman is an opinionated client-side stack, composed of several tools and libraries for scaffolding workflows to create modern web apps. At it's core, Yeoman is composed of three tools: Yo (a scaffolding tool), Grunt (a task runner), and Bower (a package manager). Using the combination of these three tools, Yeoman takes care of everything you need to get started building your apps as well as assist you through development and deployment.

A 5 minute introduction to Yeoman

Earlier this week I had the opportunity to implement this workflow from end-to-end, in preparation for developing an interactive prototype for a new project. I was able to use Yeoman to scaffold out an app using a combination of ExpressJS, AngularJS, RequireJS, and Twitter Bootstrap for the front end in a matter of minutes. Using Heroku, I was also able to deploy a production build of the app in the same amount of time. If you're interested in the process of how I took a client-side web app from creation to deployment using Yeoman and Heroku, I wrote an article on my process at Medium:

Medium: Launching apps with Yeoman