Colophon

A short "how it's made" page for this site.

How this site is built

This website is currently built with 🎈 Eleventy (11ty) v2.0.1, a wonderful static site generator that prioritizes speed and simplicity. The domain brennan.day is registered on Porkbun and hosted on Netlify with automatic HTTPS via Let's Encrypt.

The CSS is custom-built with a Gruvbox-inspired color scheme and no external frameworks, prioritizing performance and maintainability. The fonts used are Public Sans for body text, PT Serif for headings, and JetBrains Mono for code and metadata.

Drafts are usually written first as Markdown files in 750 Words, a practice of mine since September 17, 2011. Other times, I write in Bear for note-taking and idea capture.

Content is then transferred to the local git repository on GitLab, with changes saved using git. Development and formatting done in Windsurf.

Tech stack for brennan.day:

Enhanced Markdown Capabilities

The site supports extended markdown features for rich content creation:

  • Mathematical expressions via KaTeX (inline $ and block $$ delimiters)
  • Emoji shortcodes that automatically convert to emoji characters
  • Standard markdown footnotes with proper styling and backlinks
  • Mermaid diagrams for visual representations of processes and relationships
  • Custom CSS classes for styled components (alerts, buttons, color utilities)

These features enable technical writing, academic content, and expressive formatting while maintaining the simplicity of plain text authoring. See the style guide for a complete demonstration of all markdown capabilities.

IndieWeb Features

This site follows IndieWeb principles:

  • Microformats2: Proper h-card, h-entry, and h-feed markup for machine-readable content
  • Webmentions: Configured with webmention.io for receiving interactions
  • POSSE: Publish (Own Site, Syndicate Elsewhere) - canonical content lives here first
  • IndieAuth: Currently, 14 rel-me verification links for identity across the web
  • RSS/Atom/JSON Feeds: Multiple feed formats at /feed.xml and /feed.json
  • Semantic HTML: Proper landmarks, ARIA labels, and accessibility features

Principles

  • Plain text survives. Markdown + git keeps the work portable and future-proof.
  • Performance matters. Shipping less is a form of respect. Target: 95+ Lighthouse scores.
  • Accessibility is non-negotiable. Sites that work for people, not screens. WCAG 2.1 AA compliance.
  • Progressive enhancement. Start with what works everywhere, enhance from there.
  • Own your data. Canonical content on my domain, syndicated elsewhere as desired.
  • Build in the open. Source code available on GitLab, documented for others to learn from.

Current Site Statistics

  • Build time: ~0.90 seconds
  • Pages generated: 48 (47 HTML + JSON feed)
  • Blog posts: 3
  • Static pages: 29
  • Tag pages: 7 with h-feed markup
  • Search index: 4,098 words across 45 pages
  • rel-me links: 14 for IndieWeb verification

Operational Notes

These details are mostly for future-me (or anyone curious enough to poke at the source).

Local Development

Prerequisites:

  • Node.js 18+ and npm

Commands:

npm install
npm start

The dev server runs at http://localhost:8080.

To build the site:

npm run build

Webmentions

Webmentions are fetched from webmention.io at build time. The build expects a token:

export WEBMENTION_IO_TOKEN=your_token_here

Deployment

Hosting is on Netlify with continuous deployment from GitLab.

Build settings:

  • Build command: npm run build
  • Publish directory: _site
  • /uses - Tools and software I use daily
  • /accounts - All accounts and profiles I control
  • /why - Why this site exists
↑ TOP