If you’re familiar with GruntJS, you might be familiar with Gulp.js. Both are very similar, Gulp is the newer kid on the block that requires significantly less configuration to write tasks.
If you’re new to Gulp or perhaps already use it, but not sure how to do specific tasks with it, see below for a list of basic tasks you can achieve in Gulp.js.
There is a complete gulpfile.js at the bottom of this page containing all include files as well as directives if you struggle to follow along.
In the last four or so years, front-end web development has become a lot more complicated. In 2010 to install a new Javascript library the instructions went along the lines of, “add this script tag to the head of your site to use” – now the instructions always mostly begin with, “Install Node.js then run npm install”
It is easy to get caught up in the new way of doing things, we often forget that not everyone is sure what to use or what they should be using to improve their front-end workflow.
I absolutely love Gulp.js, I’ve all but used it as a replacement for Grunt as it feels a lot cleaner and requires significantly less configuration to get things happening.
Recently whilst installing Bootstrap and Font Awesome using Bower, I needed to copy the font files from the Bower package into the actual directory (because the bower_components won’t be on the live site and thus referencing the module files makes no sense).