Colophon

Framework & Language

The site is built with Astro, a modern static-site generator. Content is authored in TypeScript and Astro components. The output is a fully static site — no client-side JavaScript framework, no runtime server. You can find the full source code and CI/CD setup at https://github.com/shaftoe/personal-website.

Styling

Theme forked from zaggonaut. All styling uses Tailwind CSS v4, processed through the @tailwindcss/vite plugin. Typography is handled by @tailwindcss/typography. Icons provided by @lucide/astro. Dark mode respects the user’s system preference and can be toggled manually, the choice is persisted in localStorage.

Fonts

Content

Blog posts live as Markdown files with YAML frontmatter, managed through Astro’s content collections. The changelog is parsed directly from the project’s CHANGELOG.md file at build time using marked.

Tooling

Infrastructure

Versioning and deploys are fully automated. Every push to master triggers a release workflow powered by semantic-release, which analyzes conventional commit messages, bumps package.json version, updates CHANGELOG.md, and publishes a GitHub Release.

When a new version tag is created, a deploy workflow triggers a Netlify build that runs bun run build and publishes the resulting dist/ directory to their CDN. The same workflow also runs on a schedule every four hours to keep the homepage’s Mastodon posts and blog content up to date without manual intervention.

Analytics

Web analytics are powered by Umami, a simple, fast, privacy-focused, open-source alternative to Google Analytics. It gives total control over the data and does not violate the privacy of visitors. The tracking script is built from source and served self-hosted — see the Privacy Policy for details. It is loaded conditionally and skipped on the expenses page when the user is authenticated.

HTML Validation

Generated HTML is validated against the W3C Markup Validator (vnu-jar) to ensure standards compliance. Every page produced by the build is checked automatically as part of the test suite. Known framework-level exceptions (Astro module script placement after </html>, astro-island inline styles, heading hierarchy in blog snippet cards) are suppressed with documented justifications.

Social Images

Open Graph and Twitter Card images are generated at build time as PNGs using Sharp (which leverages librsvg for SVG rendering). Each image is a 1200×630 terminal-style banner using the Press Start 2P pixel font, with a dark background, traffic-light window chrome, and green accent colors matching the site’s theme. Three variants are generated: a default banner for the homepage and general pages, a blog-specific banner, and a 404 page banner. The images are referenced via og:image and twitter:image meta tags in the <head> of every page.

IndieWeb Compatibility

This site tries to follows IndieWeb principles and be a good citizen of the independent web:

Other Bits