In search of Static Site Generator Perfection

Static Site Generators - in search of perfection and finding Publii and Laravel Jigsaw

I've had a bit of an obsession with static site generators recently - looking for an alternative to the usual Wordpress site solutions and trying to find a different workflow for myself and some clients.

Don't get me wrong, I love Wordpress and use it every day alongside a fair amount of Shopify work, but the simplicity of Static Sites has become stuck in my head - particularly realising that I think other than Ecommerce sites (where WooCommerce, or Shopify will remain supreme) there's not much I couldn't achieve with a static site generator if I find the right solution.

The Static Site Journey so far..

Turns out there are tons of Static Site generators out there, all with their ups and downs and learning curve.  

By this stage, I've tried quite a few:

  • Jekyll makes a lot of sense, utilising the same liquid language as the Shopify platform - I haven't fallen in love with it though.
  • Grav is flat file rather than an Static Site Generator, I was really impressed with the ease of just unzipping and getting to work, super simple - but again, I didn't quite fall in love with the templating engine twig, and found that although the admin area was beautiful - in my opinion it was over complicated to hand over to clients (potentially very powerful - but with too many visible nuts and blots without the work put in to tailor to my needs)
  • Hugo fell into the same bracket as Jekyll for me (and required another new language that I'm not using elsewhere) - a shame, because both Jekyll & Hugo can be used with Forestry (a really nice back end for clients to be able to create content).

My Static Site Generator contenders

So where has the journey led me?

Well I think I've found two potentially great solutions.

Publii CMS

Publii

Publii benefits

As far as I'm concerned Publii is fantastic, the moustache templating language is simple to learn and their starter template is simple enough to pick apart and put back together, with enough functionality built in ready for the off.

The editing interface (a desktop app) is super nice to use, has enough options to make client life easy, and you get the bonus that they can locally generate a preview of their edits/site before publishing live, it has the options that many static site generators lack - you can create galleries inline with ease, can ask links to open in a new tab etc. etc.

As a web developer working on multiple sites, being able to quickly flick between different sites (and have your site sync with the client through a cloud storage solution is great. 

Publii downfalls

Publii gets regularly updated and I think it has a bright future, but there are a few limitations to take into account for a client project.

  • It's desktop only, for many people this is great (and for some being able to work away from an internet connection is amazing) but for a client who only works from a ipad, publii is currently a no go.
  • There's no spell check!! 
  • Everything is a post - although I've got around many things with custom templates, and you can create posts that act like pages - I find this limiting.  I try to create custom posts types and the relevant fields that make these make sense. e.g. working on a site that has events, I want the client to be able to click "Events" and "Add New Event" which then features specific areas for from and to dates etc. and therefore allows me to show on the front end only events after today etc.
Laravel Jigsaw

Laravel Jigsaw with Netlify CMS

Laravel Jigsaw and NetlifyCMS benefits

Lavavel Jigsaw uses Laravel's Blade templating engine - it's a templating engine I have found easy to get to grips with, and with Roots Sage I can implement into a Wordpress workflow, or of course Laravel itself.  It also means, that were any site I built in this way to outgrown it's static site nature, my templates could be moved over to Wordpress or Laravel.

I love being able to work locally with webpack doing it's live reloading thing - it's just how I'd like to be working, the Blade templating engine I find powerful enough to create what I think is needed for most sites.

But.. how will my client edit said Static Site?

Well here comes the best bit that I've been playing with recently - bring into the mix Netlify CMS and I can create the perfect (if somewhat simple) backend to my static site.

NetlifyCMS works with any Static Site Generator, the beauty is that you effectively create your own admin area to suit your site, so a site with events gets and events editing area, with all the fields necessary for events.  Same goes for posts, recipes, restaurant menu's and whatever else I can think of.  It's very simple, straightforward and pretty idiot proof.

In the most recent update, NetlifyCMS is now easy to integrate with Uploadcare meaning that images are processed and stored elsewhere, but most importantly I can set, per upload filed if I wish, image cropping dimensions - so that the client always inputs the correct image size!!! I've even created areas specifically for site wide content such as opening times.

Everything done in NetlifyCMS then get's committed to my GitHub/GitLab/Bitbucket repository so I as the developer can see and undo any changes, and work locally when I want to with no worry of conflict (or Wordpress Database / Media library differences)

 

In a future post I will go through my current Laravel Jigsaw + Netlify CMS setup solution