Problem

I needed a maintainable personal site with real content authoring - projects, posts, coursework, book notes, snippets - without hand-rolling static HTML or copying prose between places. The v1 Webpack/Handlebars site could showcase work, but it had no typed content model, no multi-environment release path, and no clean way to grow the content surface.

Approach

I rebuilt the portfolio as a Next.js 13 static site that treats content as a first-class input to the build, not files checked into the app repo.

• MDX content pipeline - a private content repo is cloned at build time (scripts/utils/clone-repo.js); a ContentRepository singleton walks typed directories (projects, coursework, posts, booknotes, snippets), parses frontmatter with next-mdx-remote, and exposes filtered/sorted/pinned views.
• Atomic UI in SCSS modules - atoms, molecules, and organisms under _04_library, composed into page templates, with MDX rendered through shared content components.
• Multi-environment CI/CD - develop -> stage -> production branches map to AWS S3 buckets and CloudFront distributions; GitHub Actions runs lint/unit/integration, Cypress e2e on preview deploys, and semantic-release with conventional commits.
• Static export - next build emits a fully static out/ tree; no runtime server, no database.

Outcome

The site shipped and stayed the live personal presence for years (releases through March 2026 per the project changelog). More importantly, the build-time content-clone pattern proved the value of a single content source feeding the site - the direct ancestor of the SQLite ingest pipeline in v3.

Predecessor to prj--personal-portfolio--v3

This stack is the direct predecessor of prj--personal-portfolio--v3. The clone-content-at-build idea became the content pipeline SSG platform that now feeds four surfaces from one SQLite artifact. Related pieces of the current platform:

• The spaced-repetition quiz PWA (quiz.paulserban.eu)
• The shared newspaper design system UI kit
• A local HTTPS Traefik + Docker Compose stack that mirrors production domains on one machine