Mark's Blog

This is my personal blog. It started out as a simple project to practice using htmx to make it an extremely lightweight and efficient website and tailwindcss for the styling.

One important requirement was that all my blog posts were to be written in markdown (in /content). It then turned out to be a bigger challenge to get the markdown file generation working than actually creating the blog. I first started out using pandoc to generate the markdown externally, but pandoc does some very weird styling and the syntax highlighting colors they support look really bad. I instead then opted for goldmark which is also in use by the hugo.

Installation

To get the blog running locally you first need a bunch of tools. The easiest way to get up and running is with mise where you can install and activate the required tools with mise activate. If you want to manually install the tools look into the mise.toml file for the exact versions required.

Justfile makes it easier to just run the required programs. Look into the justfile file to see the full commands.

1. Run templ to generate the go files that are then required:

   templ generate

2. Run the webserver:

   just d

3. In a separate terminal, run tailwindcss to continously update the css files as required:

   just tw

Docker

It's also possible to start up the website using Docker:

docker compose up --build

This will build and start up the website as well as run the playwright tests. If you're building for arm64, you'll need to modify the Dockerfile and swap out the tailwindcss CLI tool installation for the arm64 version.

Testing

For extensive testing, Playwright is used. To make the install simpler, there's a Dockerfile in e2e/Dockerfile.playwright. Build and run it from the root directory.

docker build -t htmx-playwright -f e2e/Dockerfile.playwright .
docker run --rm -it --network host htmx-playwright /bin/bash

Nix

With the flake.nix and flake.lock files you can set up local development with the exact same dependency versions.

nix develop # downloads all required dependencies
nix build .#htmx-blog # build the blog
nix run .#htmx-blog # build and run the blog locally
nix run .#tailwindcss -- -i static/tw.css -o static/main.css --watch

Note: Tailwindcss still needs to be executed manually on the side to generate the static/main.css file

Creating Posts

Posts can be created by executing the post.sh script. Simply execute the following:

just new content/posts/name_of_post