/colophon · how this site works

Colophon

I treat this site as a product, built with the same approach I bring to systems work: one source of truth per artefact, restraint over decoration, and the delivery layer owned end to end. Everything below can be checked against the source↗.

Stack

React 18 on Vite, deployed to Vercel behind tylerhagan.co.uk. Every route is prerendered to full HTML at build time and hydrated in the browser, so the page is readable before any JavaScript runs, shared links preview the right page, and every URL is a real, crawlable address. No UI framework and no CSS library: the styling is hand-rolled on CSS custom properties, which act as the site's token layer and drive both light and dark themes from one set of semantic values. Type is set in Inter for prose and JetBrains Mono for the spec-sheet chrome.

The CV pipeline

The CV is a single data module compiled to three outputs: the web version, an ATS-safe two-page PDF, and schema.org JSON-LD for the parsers recruiters actually run CVs through. The PDF is generated headlessly from the web page's print stylesheet, so the two can never drift. My email address never ships in the JavaScript bundle; it is injected only at PDF build time. This is the same one-source philosophy I use for design tokens, applied to a CV.

Locked case studies

Current employer work needs detail to be worth reading and discretion to be fair, so locked case studies are encrypted client-side: AES-256-GCM via the Web Crypto API, with the key derived from a password through PBKDF2 (200,000 iterations, SHA-256). The repo is public, but only ciphertext is committed; the plaintext never leaves my machine. Even the screenshots ship inside the encrypted payload as data URIs rather than as public images. The password is shared on request.

Details

  • The status bar is live: now playing via the Last.fm API, Berlin coordinates, and a CET clock.
  • Motion respects prefers-reduced-motion throughout; interactive states use focus-visible.
  • Machine-readable by intent: JSON-LD on the CV, an llms.txt for AI crawlers, and a note in the console for anyone who inspects.

Receipts

  • Two runtime dependencies: react and react-dom. Everything else is mine.
  • About 70 KB of gzipped JavaScript and 7 KB of CSS for the whole site.
  • No cookies and no cross-site tracking: page views are counted with Vercel's cookie-free analytics, served from this domain. The only third-party request is the Last.fm status bar.

If you are the kind of person who reads colophons, we should probably talk.