The problem
I needed a portfolio that looked like 2026, not 2018. Recruiters spend 30 seconds on a portfolio at most, and an engineering manager who clicks through wants to know how I think, not just what I've built. Most templates do one or the other.
Approach
I designed the site as a single-page hub for the 30-second scan, with dedicated case-study pages for the engineers who want depth. The aesthetic is intentionally restrained: mono base, electric blue accent, Geist Mono for display type. The signal is taste, not novelty.
Architecture
- Next.js 15 App Router: React Server Components by default; client components only where they earn it (theme toggle, contact form, scroll-fade wrapper).
- Tailwind v4 with
@themedesign tokens defined in CSS rather thantailwind.config.ts. - Content is git: flagship case studies are MDX files in
content/projects/; non-flagships, skills, and experience are typed TypeScript files. - Contact form posts to a Route Handler that validates with the same Zod schema used on the client, rate-limits via Upstash Redis, and delivers via Resend.
- Performance budget: Lighthouse ≥ 95 across the board. Self-hosted Geist via
next/font, all images vianext/image, zero client-side data fetching on the home page.
What I'd do differently
This section will grow as the site does. Capture decisions I revisited later here.