Front-end developers are often told to do certain things:

  • Work in as small chunks of CSS and JavaScript as makes sense to you, then concatenate them together for the production website.
  • Compress your CSS and minify your JavaScript to make their file sizes as small as possible for your production website.
  • Optimize your images to reduce their file size without affecting quality.
  • Use Sass for CSS authoring because of all the useful abstraction it allows.
  • That’s not a comprehensive list of course, but those are the kind of things we need to do. You might call them tasks.

I bet you’ve heard of Grunt. Well, Grunt is a task runner. Grunt can do all of those things for you. Once you’ve got it set up, which isn’t particularly difficult, those things can happen automatically without you having to think about them again.

But let’s face it: Grunt is one of those fancy newfangled things that all the cool kids seem to be using but at first glance feels strange and intimidating. I hear you. This article is for you.