Monday, 30 September 2013

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?