Colophon

What this site is built with, and why.

Hosting & delivery

Static files on Vercel. The site builds to HTML, CSS, images, JavaScript, and RSS. There is no application backend or database for the homepage or Fetch. A deployment serves the generated _site/ directory.

Code

Eleventy builds the archive, listing, product, essay, and briefing pages from src/. Public content lives under src/content/ with frontmatter validated by schemas/content.schema.json. The build also runs a snapshot regression check so existing titles, descriptions, Open Graph fields, headings, preserved routes, and primary navigation do not drift silently.

The interactive explainers use React 18 via esm.sh, transpiled in the browser by @babel/standalone. No build step for JSX. A local lucide-stub.js replaces the lucide-react icon library with a minimal set of SVG shapes to avoid loading a separate icon package. React and the JSX compiler remain external runtime dependencies.

Styling is split between an authored shared blue system, homepage composition, and each explainer's visualisation rules. Some explainers still use a previously generated Tailwind stylesheet. Their outer shell is styled independently, while their charts keep distinct colours to explain different layers.

The source repository is private. Public work is linked from the product and writing pages.

Typography

The shared site uses the visitor's system sans-serif typeface for headings and reading. Monospaced type remains for code and technical notation. The aim is a consistent hierarchy without making the homepage wait for a font download.

Colour

The personal-site palette pairs navy (#102A4C), cobalt (#2457D6), cool white, and ice blue. Light surfaces carry most reading; the homepage opening and My Journey use navy. Interactive diagrams keep their own meaningful layer colours, including green for kernels and orange for chips.

Content management

There is no CMS. Every page is a file in the repository. New public content goes through the Eleventy content model, not a hand-edited listing page: writing items live in src/content/essays/, src/content/explainers/, or src/content/briefings/; product and tool pages live in src/content/products/. Collection templates generate /writing/, /products/, and the filtered views for essays, explainers, briefings, work, and tools.

Measurement

The site uses Vercel Speed Insights and Vercel Web Analytics so the public surface can be improved from aggregate traffic and Core Web Vitals. No ad pixels, no third-party marketing tags, no fingerprinting scripts, and no cookies are set by this site. Server-side referrer-policy header remains strict-origin-when-cross-origin.

Production discipline

Articles and explainers carry publication dates; revisions are identified where they change the original account. Older technical pages describe the products and specifications available when they were written. If you spot a factual error or a broken interaction, please email me with the page and the correction.

Draft and publish flow

Draft in a current working checkout of the private source repository. Build and inspect locally, including the interactive pages, before a reviewed change is published. A local preview is not the public site.

Inspired by