Get Grunting

Grunt Logo

For many web developers, Grunt (a.k.a. “Gruntjs”) – “The Javascript Task Runner” – is an essential part of the development workflow. Through automation, tasks such as linting, minifying and unit testing become automatic and part of the edit-save-edit cycle and not chores carried out after code changes are complete.  With its huge collection of plugins, Grunt can significantly cut the time and effort required to build and maintain quality code.

Unfortunately, as the Grunt website itself points out, “While installing grunt is simple, it’s slightly more involved to get it running on your project”. Having spent numerous hours getting my first Grunt task to work, only to think “is that really all that I needed to do?”, I can certainly vouch for the accuracy of that statement. While the official documentation is constantly being improved it still suffers from taking a “too much too soon” approach, leaving the beginner confused and frustrated as he or she wades through the seemingly endless configuration options.

A simple Grunt run: This job runs in the background each time I save a change, linting, minifying and unit testing.
A typical Grunt run: This job runs in the background each time I save a change and lints, minifies and unit tests.

Thankfully there are a number of great articles out there that strip away the complexity and explain just enough to get the new Grunt-er on the right path. Below I’ve listed six tutorials that I found especially useful when getting started with Grunt. Naturally, there is some overlap in their content but they are all concise enough to read and assimilate quickly and each contributes something valuable.

As you’d expect, these are introductory tutorials and don’t cover all aspects of Grunt. As I was specifically interested in using Grunt to run jsLint, UglifyJS for minification and Karma/Jasmine for testing they tend to reflect that.



Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s