Evolution of a website

This is a short technical post - I’ve changed the way that I build and host the site several times over the last year, in order to achieve (in order) improved reliability, more creative input and performance. For those interested in the technical side of things I moved from Wordpress, to containerised Ghost, to Ghost running natively on Linux and now the site is entirely statically generated using Jekyll. At last I have something which is highly performant, very secure, easy to manage and trivially easy to backup and restore. I talk in detail about the process I went through further down this post.

Moving from a blogging engine to a static site has made it easy for me to rethink the home page and the ‘games’ page, and I’ve been working on the games page to highlight my main games (A Cool and Lonely Courage and Starguild: Space Opera Noir), provide links to downloadable resources and related pages.

I think that the games page is much better now - the structure and organisation is prettier and more functional. I hope that visitors find that too.

After a review of home pages by other small to medium sized games companies, I’ve decided that the main change I want to include there is a clear banner to the shop (drivethrurpg in my case) and below that the latest updates on the site, which will tend to be reviews and blog posts.

Technical details

I’m going to get quite techie here, and if that isn’t your thing feel free to stop reading here, I won’t judge you!

The site started out built on a CMS (Content Management System) because I wanted to be able to easily and quickly publish pages about my games, blog about the development process and the kickstarter process and so forth. If you were to look far enough back on the Internet Archive you could find a version of the site which ran on my home grown CMS, because who doesn’t like coding their own CMS every now and then? I’ve been a web developer since the mid 1990’s, and my day job doesn’t give much opportunity for actual coding now, so I enjoy side projects.

Wordpress

Still, adding features to the home grown CMS was time consuming, and when I wanted to take the site to the next level it made sense to move to a commercial CMS. The big ogre in the forest was Wordpress, as used by many, many successful websites. It has so many features that its bells and whistles all had bells and whistles of their own! I converted the site to that platform, and ran it hosted on the Wordpress site under my own domain, where it lived happily for 2-3 years. I did start to get a little frustrated by some little things - I didn’t particularly like the editor, and in order to change the themes you had to delve into complicated code written by someone else, so I was finding it hard to configure it exactly how I wanted. In addition, I started to think that I wanted more control over my hosting - and rather than rely upon Wordpress I wanted to run the CMS on my own server.

Wordpress is open source, and freely available to run on your own server. However, there is a security consideration there. Because Wordpress is very popular (75 million websites according to WhoIsHostingThis.com ) it is an attractive target for hackers. Because it is a very large and complex system, it has a very large attack surface. Combine these, and running your own Wordpress on a server could be a full time job keeping up with patches and upgrades. Not something that I wanted to get into!

So I wanted to find a smaller, more compact, high performance CMS. Ideally one that allowed me to write in markdown (invented by John Gruber for writing for the web and explained on Daring Fireball ). I love writing in markdown, and having that translated into simple html. Wordpress was all about the wysiwyg editing environment.¹

Ghost

So after some research my thoughts turned to ghost. An open source blogging engine written in node.js with plain markdown publishing that just gets out of the way. Sounds great. Unfortunately when they moved to ghost v2 they introduced a new special editing engine which broke some of the markdown features I loved and basically turned into yet another wysiwyg editor. Still, worth a try I thought.

Ghost on docker

Docker Containers give the promise of insulating me from versions of node etc, so I thought I’d use an official ghost container to run the site. It was a bit of a nightmare, every week or so it threw away all my data and initialised itself again. My investigation eventually led to the unwelcome truth that I found it impossible to map the ghost database location to the shared volume that makes container data persistent. And at random periods of time the container hosting environment would shuffle its containers around between servers, losing any data which wasn’t on the shared volume. That was not fun. The ghost database was in one location and the uploaded image and other files were in another location, neither of which were immediately amenable to mapping. After half a dozen attempts to solve the problem I decided that containers were not proving to be the ‘simple’ answer to hosting that I had thought!

Ghost on Linux

Next step - install everything on a Linux server. This turned out to be very easy to do, and I quickly had the site up and running reliably again. No more periodic initialisation of the site. Times were good. Then there was an accounting problem at the end of the month and the server was stopped. Sorted that out, restarted everything and it turns out that it hadn’t enjoyed the un-graceful shutdown. It wouldn’t start up.

I had to dig through my notes, recreate my secure tunnel to the server, repair screwed up permissions. It was a long and painful job. Along the way I realised how frustrating it was that ghost stored multiple copies of uploaded files, didn’t do any optimisation of images and still had the editor problem which stopped me using pure markdown easily. Plus there was a bug which prevented my images being presented over https which doesn’t go down well on chrome.

Jekyll

I wanted more control and less grief. I wanted a better backup, better performance and more fine grained control. So what about static site generation?

After all, I don’t have to set press releases with specific release dates, I don’t need to have online editing capabilities. Plain html sites can be served like lightning by web servers and their security threat footprint is many orders of magnitude smaller. Jekyll is the platform I decided to use, and I have been absolutely delighted by it.

Once it is installed and configured (full details for this can be found on their site linked above) it is easy to build and iterate locally, and then when I’m happy with the results push the built changes to my web server. I use Microsoft Azure for my hosting, and I also use it for source control, so I have set up a DevOps pipeline so that when I push changes to my master branch, the pipeline will automatically publish the new site to my web server. It’s my favourite workflow yet; as much automated as possible. I can even revert to an earlier version of the site with ease if I wanted to.

Photo by Markus Spiske on Unsplash