Learn about 5 Grunt build tool plugins to optimize your workflow.
A quick note: All of these tasks leverage minimatch, a 'minimal matching' utility that I highly recommend reading up on if you haven't already: minimatch on GitHub
I rarely, if ever, create a Grunt file without including watch. Being able to run
grunt watch and know that I don't need to run my tasks over and over again allows me to shave of huge amounts of time having to context switch between the terminal and my editor.
For my cookie manager utility, this is what my watch task looks like:
Watch is pretty straight forward:
Your watch task can get pretty complex with options, but I keep mine basic by just enabling livereload (which will refresh my browser automatically).
Like watch, the jshint task can be pretty simple, just pass it a minimatch array of files you want it to check and you're on your way. One extra option that I didn't show in the example above is the
afterconcat options. This allows you to run jshint on your source files before and your concatenated files after.
Unit testing (or any formal testing for that matter), seems to me to be the most under-utilized tool most front-end developers have. As developers, we could save a lot of time simply by leveraging unit tests to make sure we don't break or regress code we've already written. Thankfully, there are a lot of great testing frameworks out there, and Mocha is the one that I like to use, because it allows you to run client-side unit tests in a headless browser.
I like to tie all of these tasks together with the Notify task. Notify will use whatever system notification application you use (Growl, notify-send, Snarl or OSX Notification Center) to alert you when something is complete or fails.
When something fails, grunt-notify will alert you with a notification that looks like this:
I also like to add a banner with the package name, the package version, where the package lives and a timestamp.
Not all workflows are created equal, and it's likely that there are far superior workflows to this one out there. This is an example of me learning by doing and finding what works for me.
What are you doing to be more productive in creating your development projects? Do you have anything you'd add to make this one better?
Subscribe to my Newsletter
Every other week I publish the Curiously Crafted newsletter.
In it, I explore the intersection of curiosity and craft: the people who make stuff, what they make and the way they pursue the craft of making.
On The Web
See all of the places I have a presence on the web.