Jekyll and the build scripts a few years on

A few years ago I moved my sites from a PHP templating system to static generation using Jekyll. How is it working out?

Pretty well. I’ve had no downtime (that I haven’t caused) which is to be expected on a low-traffic website serving HTML files. Updating content and templates has been easy, with Jekyll remaining simple to use. While I’m sure I’m in need of an update, that is less of a concern than if I was running code exposed to a user. Overall no problems with the technology or maintenance - indeed I find it much easier to work with than previous versions of the site as I don’t have to re-learn my configuration each time I want to do anything more complicated than change some words.

The biggest win - and something I actually considered skipping when I initially implemented - has been with the build scripts. In professional life I wouldn’t think twice about writing automated build scripts for a project but we all know that this kind of thinking isn’t as rigorously followed for personal projects. I wrote a simple mina script for deploying (and updating) my sites and several years on I deeply thankful to my past self. I haven’t had to keep my build process in my brain at all - just the magic command, which is in a README somewhere. This has meant small updates have been easy, the most boring part of site maintenance has all but gone away and consequently those updates have actually happened.

The lesson to take away here is that doing the hard (and dull) work up front of defining a development process and writing deployment scripts was worth it. Not so much because of time saving, or the consistency inherent in an automated process - but because these benefits actually encouraged me to maintain my sites in a way I simply wouldn’t have done had I been required to remember how to deploy my work each time I did anything.

The Year in Pictures

A few years ago I was involved with 12 Cakes - a project which put up a cake recipe every month for a year. It was a nice, simple idea and got me thinking about doing something similar using photos. So, after a year of messing about and not finishing the site, I've create The Year in Pictures. Along with five friends and family, I am selecting one photo each month which says something about that month and putting them together on a website.

There is no real goal for this. By the end of the year I'll have 12 months of photos for 6 people which could be used for a variety of things but for a change I'm not worrying so much about the end game and just enjoying watching it grow. Three months in, there is now enough to look at that it's worth being seen beyond the six contributors so I'm going to start mentioning it on Twitter when a new month is uploaded.

If you're interested in the technical details, the website is static HTML generated by Jekyll and styled using Foundation. The photo pages are created using a Jekyll generator (combining a photo and some metadata from a YAML file to produce a full page) and most of the rest is done with macros. The code is on Github if you would like to see how it all works - it was creating using my Jekyll bootstrap project.

Jekyll and Foundation with Guard

tl;dr - I've dropped the jekyll asset pipeline in favour of Guard in my pre-configured example project of Jekyll and Foundation.

A few weeks I wrote about my attempts to create a bootstrapped jekyll / foundation combination using the Jekyll asset pipeline to keep things building on the fly. I hit a snag, though. The asset pipeline was abandoned back in February and is locked to version 0.12 of Jekyll (current release being 1.2.1 at the time of writing). There are various forks of the project which bring things up to date but I'm worried about being left in the same position again and, frankly, I'm starting to question the methodology of using Jekyll to do everything instead of running the tools separately.

What I really want, I think, is some kind of meta-tool which lets me manage my build environment but by using the core tools - in my case Jekyll and Compass and probably a CoffeeScript processor eventually - so I (hopefully) have fewer maintenance problems down the line. Seems like Guard is pretty much what I want. I'm coupling it with guard-jekyll-plus and guard-compass to work with those tools. It isn't perfect, and doesn't assuage my dependency fears entirely but it feels a much more robust solution than the previous version.

My basic jekyll-foundation project has been changed to use this new tool chain and seems much more responsive than before (could be anecdotal) so I'm looking forward to making more use of it.

Jekyll and Foundation automatically recompiling changes

tl;dr - I've glued jekyll, jekyll pipeline and foundation into a pre-configured example project.

I look after a handful of small sites and I've been playing with different ways of maintaining them and keeping them vaguely modern. A CMS is the obvious way forward, but that has the learning curve problem and, frankly, after working away at this kind of thing all day I'd rather approach the problem a little differently.

What I really want is something which lets me write content in my markup language of choice, then generates some html for me and wraps it in a template. It should also handle some of the simpler optimization tasks (minifying, compressing, compiling any sass) and ideally allow some kind of on-the-fly regeneration of all these assets so I can work and hit refresh with it running in the background.

Jekyll seems like a good contender as a starting point. I love the fact it generates static HTML files for me (I'm getting tired of requiring the comparatively slow processing power of PHP for ultra-simple tasks) and it has a "watch" mode for recompiling the pages as I work. It uses the Liquid templating engine, which is sufficiently simple for my needs, and there is support for a variety of markup options.

Next, I need some sass support. This is easily done, but I want a simple workflow so it needs to recompile on the fly while jekyll watch is running. Step up the jekyll asset pipeline which lets me add whatever I like to the jekyll process with a minimum of fuss, including css compression and the sass compilation I wanted. I'm pretty sure I could add CoffeeScript support with it too, but I haven't tried that yet.

Right, I have the components I need. I'm going to work with Foundation 4 because it happens to be a framework I know relatively well. If only there was a vanilla project which pulled all this together ready so I could just fork it and start building a new site. Oh look.

In all seriousness, I've hammered these elements together into something that should be easy to just pick up and start using. I'm hoping it'll be useful to me and - this being the internet - chances are that means it'll be useful to someone else too. If that someone is you, enjoy this vanilla jekyll project with foundation sass built on the fly. Why not let me know?