How does this site work?

Published 2020-01-15

Static-Site Generator

This site is generated by the excellent Eleventy static-site generator. I was previously using a fun flat-file CMS called Grav, but decided to migrate to a static-site generator for two main reasons:

• Being able to use cheaper (or free) static hosting
• More flexibility

To expand on the latter, the tipping point finally came when I had a plain old HTML file that I wanted to include in my website. I didn’t want it to inherit the layout of the rest of the site, I didn’t want anything done to it, I just wanted it to exist. I couldn’t figure out an easy way to do that with Grav. Grav expects every page to be a markdown file, so to create a standalone page from HTML, I would have had to create a new page template with the desired HTML and a placeholder markdown file using that template…too much hassle.

Contast that with Eleventy, which is perfectly happy to just suck things in one side and spit them back out the other, untouched. For example, say you created basic website with several pages and directories and ran Eleventy on it, the output would be exactly the same as the input. Same files, same directory structure. In one side, and out the other. But if you put some markdown files in there, and create some templates, Eleventy will process those and output HTML. In other words, its abilities are iterative—you can have it do as much or as little as you want.

Local development with Eleventy is really sweet as well. It comes with a local webserver that watches your source files for changes, and automatically rebuilds the site and refreshes your web browser whenever you modify a file. No more save, refresh. Save, refresh.

Hosting

Hosted for free on Github Pages.

If you’re interested in deploying your own Eleventy site to Github Pages, I wrote a guide.

Git

The entire site is in a Github repo. When I make a change to the site and push to the repo, a Github Action runs Eleventy and rebuilds the site. I followed these instructions to set up the Action for Eleventy.

I was previously hosting the site on the free tier of Netlify, which is very slick. You just point it at your Github repo, and it automagically figures out what static-site generator and rebuilds your site every time you push to the Repo.

I decided to do the little bit of extra legwork and set up Github Actions instead just to be reliant on one less service.

Previously…

See the previous version of this page for a more thorough description of Grav + Git + Cloudways.

The adorable possum floating around this page on a balloon…

…is the official Eleventy mascot. I cribbed it from there. I hope he doesn’t mind.