My Personal Website

Problem

Most portfolio sites show finished screens without explaining their constraints or implementation. This site needed to publish that engineering context while remaining fast, accessible, inexpensive to operate, and useful without client-side JavaScript.

Constraints

• No database, CMS, authentication, or runtime content dependency in the first release.
• Core pages must work without client-side JavaScript.
• Unverified employer details and performance claims cannot be published.

Approach

1. Use the Next.js App Router with Server Components and static rendering by default.
2. Keep content in typed, version-controlled modules and validate it during builds.
3. Define a small token-based design system with narrow interactive boundaries.

Architecture

Tradeoffs

• Git-based content favors reviewability and low operational overhead over nontechnical editing.
• The initial visual language favors typography and layout over image-heavy presentation.
• The contact experience uses direct channels until server-side delivery and abuse controls are configured.

Testing

• Schema and helper unit tests
• Critical navigation and theme browser tests
• Type, lint, accessibility, and production-build checks in CI

Outcome

Projects, roles, and services are validated data modules, so new entries can be added without changing the route or card architecture.

Lessons

• Requiring every project to document constraints, testing, and tradeoffs produces stronger case studies than a screenshot gallery.
• Static rendering covers nearly the entire product; client JavaScript is reserved for theme controls, motion, and count-up metrics.