Gone are the days of manually setting up your web applications to handle tedious boilerplate tasks… well mostly 😉 Productivity boosts can be achieved by offerings from tools like Yeoman, Grunt, Gulp, Bower, as well as a slew of others out there. I personally find these tools helpful in that they’ve helped me to focus more time on developing solutions rather then focusing on the smaller boilerplate bits and pieces of my development workflow.

One tool that I use quite often is Yeoman. Yeoman is an application-scaffolding framework, which allows you to choose different scaffolding templates, called generators, and use them as necessary. Generators will typically scaffold an application skeleton along with some really nice perks. These perks sometimes include features like:

  • A web server with live-reload
  • A Sass compiler
  • Tasks that allow you to minify your code
  • Tasks that run your unit tests
  • And more

The open source community generally contributes to the vast number of yeoman generators available. As a result, I’m given an array of options to help in my efforts to formulate an optimal workflow. There’s something for almost everyone. And if you can’t find it out there, given the knowledge and time invested, you can empower yourself to build what you need and share with others.

Need to create a web app that uses angular? No problem, there’s a generator for it here.

What if you want to develop a chrome extension? No problem, there’s a generator for it here.

What about a Cordova/Phonegap application running on the web based mobile environment simulator, Ripple? Not a problem, I just built a generator for one and put it up on Github. Here it is, https://github.com/keunlee/generator-cordova-ripple.

And here’s what it has to offer:

  • Starts the Ripple Emulator in a browser and will begin watching your CSS and JS, and rebuild every time you save a change. It will auto refresh the ripple emulator’s viewport too.
  • Adds a Cordova “browser” platform plugin for you to test your mobile apps in a web browser.
  • Dynamically wires javascript dependencies to your index.html file when adding javascript libraries through bower.
  • Creates a Cordova friendly application skeleton for you to build off of.

While I only focused primarily on Yeoman in this article, with a bit of shameless self promotion 😉 the point is that, given the right tool, and used wisely, you can put yourself in a situation where you get to focus on the things that are important and interesting for the task at hand. Additionally, tools are aimed at helping you, not doing the job for you. If you understand what your tools do, then you’ll have a much better time finding out what tools are best for the right job, which in turn can lead to increased productivity.