Building a website with gulp.js

October 25, 2016

Last week I decided that my blog should be generated by gulp.js. It seemed like the best possible choice for me, so I started to look how I should use gulp.js to implement the features that I had been thinking. First of all, I listed the functionalities.

Features of the build tool

  • Copies assets to the build
  • Generates the blog with normal template and AMP template
  • Builds SASS to CSS and includes the CSS in the HTML files
  • Parses metadata from Markdown files
  • Converts Markdown to HTML and includes it in the HTML files
  • Generates the navigation to the main page
  • Automatically watches changes and updates the build accordingly

Next step was to think how to implement those. I haven't had much time to work on this project lately, so I was hoping that I could get it done in few hours. The goal was to have first working version of the build tool this week. While googling some solutions I bumped to the fact that gulp.js 4 was available as a development version. I checked it out and decided to still use 3.x. I'll later update to version 4 when it is released.

Creating the build tool was fairly easy as my requirements were simple. In the end I think gulp.js was painless choice. I didn't need to write much code because there were so many plugins available. I'm happy about the outcome and will be updating the script when I need more functionality or I want to change to gulp.js 4.

The implementation is only 200 lines of code and I think it is really simple. If you don't know gulp.js then I suggest you check the plugins that I've used to create the functionalities. My own functions merely assign some variables that I can use in the templates. The code can be found from There is some guidance in the of the repository if you want to know how to install and use the build tool.