How this site was built

🧭 The kit

• 🏗️GeneratorAstro 7Static output, zero JavaScript by default. Content collections validate every YAML and Markdown file at build time.
• 🗂️ContentYAML + MarkdownUpdating a role or a number is a one-line commit, and the schema catches mistakes before they ship.
• 🎨StylingPlain CSSThe design is expressed as about thirty custom properties. No framework needed.
• 🖼️IllustrationsInline SVGSix scenes and the bikepacker, recolorable from one CSS variable, lighter than a photograph.
• 🔤FontsSelf-hostedBarlow, Barlow Condensed and Spline Sans Mono. No third-party requests; the headline face is preloaded.
• ☁️HostingCloudflare WorkersStatic assets from the edge and one Worker for the contact endpoint, custom domain on the apex.
• 🛡️Contact formTurnstile + ResendHoneypot, per-address rate limit, Turnstile, then Resend. Spam is handled at the edge.
• 📈AnalyticsCloudflare + Google AnalyticsCloudflare counts visits at the edge without cookies; Google Analytics loads after the page does, only on the live domain.
• 🧰ToolingBun + miseBun for packages and scripts, Node underneath, both pinned by Mise. One command sets up a clone.
• 🚦CI/CDGitHub ActionsType and schema checks, Playwright, axe, Lighthouse CI; a preview per pull request; deploy on merge.
• 🔐Secrets1PasswordA service account; Worker secrets synced on every deploy. GitHub holds a single token.
• 🔁UpkeepRenovateDependencies move on their own and CI is the gate.

⛰️ Decisions

⚛️ Why not React

There is one interactive element on the page, the phone menu, and one form. A framework runtime would be the largest asset on the site and would buy nothing. Astro leaves the door open for an island containing React elements if that changes.

✏️ Why the illustrations are code

The six scenes and the bikepacker are SVG, so the whole route from Banff to Antelope Wells weighs less than one photograph, scales to any screen, and picks up the accent color from CSS. On phones each scene re-frames around the rider instead of shrinking.

🔀 How content updates work

Edit a YAML file, open a pull request, get a preview URL, merge. If a field is missing or a date is malformed, the build fails with a message pointing at the line.

📄 Why the résumé is data

The résumé lives in a YAML file beside the rest of the content. The build renders it as the résumé page and prints that page to the PDF with the same headless Chromium the tests use, so the download never falls behind the site. Numbers that both state, like the patent count, are written once and filled in everywhere else.

🤫 How the contact form stays quiet

A request has to pass a content-type check, an origin check, a per-address rate limit, a hidden field that humans never see, field validation and a Turnstile verification before Resend sends anything. The endpoint logs one line per request and never the message.

🏔️ What I would change at scale

For a multi-author site I would add a CMS; for a product I would add an image pipeline and a real design system. For one person and one page, this is the right amount of machinery.

🗺️ The route, section by section

🏁 Credits