I started using Gulp and Browserify lately and, quite frankly, they’re great.  However, transitioning to a new build system is not without its pain points, no matter if you’re moving from something like Grunt or if you’re adding your first build tool to an existing project.  The documentation is good and Gulp itself is easy to use, but most of the browserify examples are geared toward simpler projects where only one bundle is needed.

For example, if you’re creating a website of any significant size, there are likely to be multiple pages with varying functionality. You don’t want to create one giant bundle that contains your entire site’s JavaScript. Monoliths are bad, mmmkay?  With that in mind, here are the main points that we’ll be walking through:

• Intro to Gulp
• Project Structure
• npm Setup
• Installing Dependencies
• Bundling and distributing multiple applications with one build script
• Automatically rebuilding applications
• Simplifying require() paths
• Transforms for templates
• Unit tests and linting
• Housekeeping
• Convenience tasks
• Finding other recipes

That’s a lot of stuff to cover.  As the title of this article implies, I’m assuming that you’re starting from zero.  If you already know a little about npm, gulp, or browserify, you can probably safely skip ahead.  TL;DR: If you’re already decently acquainted with all of these tools, then you can just take a look at my gulpfile.js. … →