I want to make websites using Jekyll, Webpack and a touch of AJAX. I want them to be lean, but also to have the option of using large established frameworks if necessary. I want to be able to fix them when things (inevitably) break. I want Jekyll because it has a nice ecosystem available. I want Webpack so that I can compress stuff and replace Jekyll Assets. I want AJAX and the history API so I can do cool stuff without having to reload the web page.

Unfortunately there wasn’t an existing boilerplate setup to do exactly what I want, so I had to make my own.

Check out the gitlab repo if you want to see how this works. I intend to use this as a basis for all the websites I make (minus the styles and animations). If you’re looking for an out-of-the-box solution you’re probably better off going with lanyon and modifying it since this is set up to be quite specific to my use.

Why make this?

While I probably should’ve gone with one an existing option there is simply nothing that fulfils all my needs (or wants). I tried alternatives like Lanyon and couldn’t get them to run. By making something myself I get exactly what I need without all the fluff. Plus it’s a great learning experience and I hope it might help others as well.


Jekyll with Webpack inspired by allizad (medium link / github), the jekyll-webpack-starter and David Stancu’s blog post.

Jekyll with AJAX inspired by jeykll-ajax and Mozilla’s article on the history API.

You can find the source code for Jekyll at GitHub: jekyll / jekyll

You can find the source code for Webpack at GitHub: webpack / webpack

You can find out more about pushstate and the history API at MDN: Manipulating the browser history with a great simple tutorial here.