Shipping the architecture phase
Turning a stacked-section homepage into a real information architecture: typed content, build-time loaders, and dedicated routes for log, projects, and lab.
Situation
The homepage was a single page.tsx file with every section — hero, projects,
lab, about — hardcoded inline. It worked as a placeholder, but there was
nowhere for a real build log or project detail pages to live, and no data
model behind any of it.
System
Content now lives as typed files under /content — MDX with frontmatter for
projects, a five-file split (situation, system, move, result, takeaway) per
log entry — validated with zod at build time and loaded through functions
in lib/. Routes read from those loaders instead of holding data directly.
Move
Defined the shared types first (lib/types.ts), then the loaders
(lib/log.ts, lib/projects.ts, lib/lab.ts), then the routes, then rebuilt
the homepage as composed components pulling real data — in that order, so
each layer could be checked against a working build before the next one
was added on top.
Result
A log post, a project, and a homepage that reads live counts and the latest entry — all from the same typed content — with slugs, routes, and SEO scaffolding (sitemap, RSS, JSON-LD) in place for whatever gets published next.
Takeaway
Structure first, content later. Building the loaders and routes before there was much to put in them meant the architecture had to hold up on its own — and now new posts and projects ship by adding files, not by touching page code.
“Structure first, content later — the site can now grow by adding files, not by rewriting pages.”