If you want to use JavaScript on a website and avoid the minefield of tools out there, Brunch is a great tool to consider.
Recently, I had the chance to start a greenfield project. Because nothing was set, I ran into the bane of the JavaScript ecosystem: the JavaScript ecosystem. Specifically, I had to decide what tools this project would use.
Not so long ago, a simple project could get away with hacking some code into a single .js file, include it in a script tag, and be done with it. Modern JavaScript development is not nearly so straight foward. With the rise of ES6 and the modularization of libraries via npm, building out the final file can be fairly complicated.
Knowing this, I looked at the popular options. Broccoli.js, Brunch, Grunt, Gulp, and webpack to name a few.
So, let me jump to the conclusion:
Brunch focuses on being a build tool and nothing else. This greatly simplifies using it and makes it a strong option.
The other tools that I examined have their place, but here are some reasons why I like Brunch.
1. Very little setup
Brunch follows a convention over configuration style. This means that there isn't much to put into the configuration file. Play by the rules (of which there are few) and it will typically do The Right Thing™.
2. Use ES6 with almost no thought
If you want to use the latest JavaScript features, you have to deal with a transpiler like Babel. ES6 is only a single plugin away (babel-brunch) from automatically working with Brunch.
3. Three commands in total. Yes, three!
$ brunch new
$ brunch build
$ brunch watch
That's it.
brunch new will help you bootstrap a new project. Because of the use of conventions, this is the recommended way to get started. The command will set up all the structure you need to get creating. With the help of some project templates called skeletons, you can even get initial plugin configuration out of the way. Try it with:
$ brunch new -s es6
brunch build and brunch watch will both do the work of building your JavaScript payload. The two are related with one big distinction: the latter will watch the files in your project and incrementally update the output whenever something changes. Watching your project for changes is a powerful paradigm used by many of the tool chains out there, and it's nice that Brunch also has that feature.
I think I can read your mind:
Oh great, some new fangled JavaScript tool. This must be the new hotness, right? I bet it's another flash in the pan.
This is the interesting part to me. Brunch is not new. Not even close. The project started in 2011. That even predates Grunt. I think Brunch is a tool that deserves more attention because it solves the JavaScript build problem in a very simple way. Check it out.
This article first appeared on mattlayman.com.
Top comments (0)