A New Look

If you read my last post, you know I've been on the hunt for new solutions to power my web site. If you're reading this post, you can probably guess from the new look of my site that I found what I was looking for.

At first, I looked at Jigsaw, but after some examination, I found that it needed much more care than I wanted to devote.

Instead, I landed on Statamic. It's a CMS that feels simpler than WordPress, can function as a static site generator, and has a starter template that didn't require much work to adapt to my needs using Tailwind.

The Statamic documentation recommends using prism.js for syntax highlighting, but unfortunately isn't much help on how to go about adding it. By chance, I stumbled across a babel plugin for integrating it. Installing it was a snap.

npm i prismjs babel-plugin-prismjs

With a little shell magic, I was able to get a list of languages used in my existing posts that I used to configure which languages my prism.js build would support.

grep -ahER '^```[^$]' content/collections/articles/ | sort | uniq | sed 's/^```//g'

A .babelrc file later, I was off to the races.

{
  "plugins": [
    ["prismjs", {
      "languages": [
        "bash",
        "css",
        "ini",
        "javascript",
        "json",
        "makefile",
        "markup",
        "php",
        "ruby",
        "sql",
        "yaml"
      ],  
      "plugins": [], 
      "theme": "okaidia",
      "css": true
    }]  
  ]
}

I was even able to create a Docker environment suitable for running the Statamic Control Panel.

FROM composer

RUN composer global require statamic/cli
RUN apk --update add nodejs npm php8-gd php8-exif
RUN echo 'extension=/usr/lib/php8/modules/gd.so' > /usr/local/etc/php/conf.d/00_gd.ini
RUN echo 'extension=/usr/lib/php8/modules/exif.so' > /usr/local/etc/php/conf.d/01_exif.ini

Building it is easy.

docker build -t statamic-blog .

As is running it, which I do with a script that runs the following.

docker run -it --rm -p 3000:3000 -v `pwd`:/app -w /app statamic-blog sh

Most of the remaining effort was in migrating my existing content and tweaking the theme to my liking.

Overall, I'm pleased with the results. Here's hoping this solution stands the test of time.

If you'd like to look at my configuration, I've published it to GitHub.