← Back to portfolio

johnedmondson.dev v2 — This Website

A bilingual portfolio and writing site built on Next.js with an atomic design component library and a file-based CMS.

The home page of this site, captured from the current build.
Role
Design & Engineering
Year
2026

Stack

  • Next.js
  • TypeScript
  • Sass/SCSS
  • React

Why a rebuild?

Version one did its job, but I wanted three things it couldn't offer: a real home for longer writing, proper German/English support, and a component library organized the way I think about interfaces.

Architecture

  • Next.js App Router with locale-segmented routes (/en, /de) and a cookie-aware middleware redirect
  • Atomic design — atoms, molecules, organisms, and templates, each with co-located SCSS modules
  • File-based CMS — posts are JSON documents edited through a local /admin interface; publishing is a git commit, so the production site stays fully static with zero database
  • A dependency-free Markdown renderer for post bodies

Two kinds of posts

Portfolio pieces get an image-forward template with a sticky project fact sheet — client, role, year, stack, links. Writings get a focused editorial column tuned for reading. Same content model, two presentations.