Brian P. Hogan - Automate with Grunt: The Build Tool for JavaScript

Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks. Where those designations appear in this book, and The Pragmatic Programmers, LLC was aware of a trademark claim, the designations have been printed in initial capital letters or in all capitals. The Pragmatic Starter Kit, The Pragmatic Programmer, Pragmatic Programming, Pragmatic Bookshelf and the linking g device are trademarks of The Pragmatic Programmers, LLC.

Every precaution was taken in the preparation of this book. However, the publisher assumes no responsibility for errors or omissions, or for damages that may result from the use of information (including program listings) contained herein.

Our Pragmatic courses, workshops, and other products can help you and your team create better software and have more fun. For more information, as well as the latest Pragmatic titles, please visit us at http://pragprog.com.

We strongly recommend that you read this book with the publisher defaults setting enabled for your reading device or application. Certain formats and characters may not display correctly without this setting. Please refer to the instructions for your reader on how to enable the publisher defaults setting.

First, thank you for picking up this book. I wrote it because I was frustrated at the lack of meaningful Grunt documentation online. Hopefully you find this a nice, handy quick start.

Next, The Pragmatic Bookshelf continues to be the absolute best place to publish books. Dave Thomas and Andy Hunt always provide just the right amount of guidance, and my wonderful editor Susannah Pfalzer once again made sure that everything I wanted to say actually made sense.

The technical reviewers for this book were excellent and thorough, trying every example to find out what worked and what didnt, and keeping me honest when it came to explaining how things functioned. Thank you, Andrea Barisone, Kevin Beam, Daniel Bretoi, Trevor Burnham, Alex Henry, Jeff Holland, Jessica Janiuk, Jenna Pederson, Stephen Orr, and Justin Searls, for all of your great feedback and insights along the way.

Thanks to my business associates Chris Warren, Chris Johnson, Mike Weber, Nick LaMuro, Austen Ott, Erich Tesky, Kevin Gisi, Jon Kinney, and Myles Steinhauser for their continued support.

Finally, thank you, Carissa, Ana, and Lisa, for your love, understanding, and support. And for being awesome.

Web development has changed. The days of opening a few text files in your editor of choice and then uploading them to the live site are long gone. Todays web applications demand complex styling and functionality that only advanced CSS and JavaScript can provide. These assets get quite large and unwieldy, and the process requires a new workflow.

The JavaScript community has embraced Grunt, a powerful automation tool and task runner written in JavaScript, to handle these workflows. With Grunt, you can watch files for changes, concatenate CSS files and JavaScript files together, obfuscate or minify client-side code, run tests, and check your code for syntax errors, all automatically. Unfortunately, a lot of documentation on Grunt centers on copying and pasting various bits of code rather than focusing on how Grunt itself works.

This book will help you understand how Grunt works and show you how you can make it part of your development process. When youre done youll be able to use Grunt on your own projects and build your own tasks and plug-ins.

This guide is meant to be a quick overview of Grunt, using hands-on examples to illustrate its features.

Well start out by looking at the very basics of Grunt, defining some simple tasks as we build our first Gruntfile. Well create basic tasks, create tasks that take in parameters, chain tasks together, and document tasks. Then well look at Grunts built-in tools for working with files and folders on the file system.

After that well look at multitasks, a feature of Grunt that lets us define a single task that can have multiple output targets. This is useful for file conversion and other tasks where you might need to create separate distributions from a single source.

Next well use several Grunt plug-ins together as we configure a workflow to develop a modern single-page web application with CoffeeScript and the AngularJS framework. Well cover conversion, minification, and file watching so you can see how easy Grunt makes automating important repetitive tasks.

Then well look at what it takes to create our very own plug-in for Grunt. This will give us a chance to explore how Grunt can leverage Node.js and external programs, as well as how to break Grunt tasks into reusable modules.

And finally, well use Grunt to create project scaffolds. Well play with existing plug-ins and then well create our very own project template that we can use when we start our own web projects.

In addition, each chapter gives you suggestions for further exploration, offering you the opportunity to dig deeper into Grunt.