Project Website

Live

This site: a tested, accessible portfolio with dark mode, built with Next.js and deployed on Vercel.

Started September 2026 · Updated October 2026

Screenshot of the portfolio website home page

What It Does

The portfolio you are looking at. Every project on it comes from a single typed data file, so adding a project is one entry and the home page, archive, search, filters, project pages, sitemap and social cards all update from it. It follows the system light or dark theme with a toggle that remembers the visitor's choice, and is built to be keyboard and screen-reader friendly.

Key Features

Searchable, filterable archive of projects driven by one typed data file
Light and dark themes that follow the system setting, with a saved toggle and no flash on load
Accessible navigation: skip link, keyboard focus styles, and reduced-motion support
Metadata for search and sharing: sitemap, robots, web manifest, and social cards
Unit and component tests with Vitest and end-to-end tests with Playwright

Technologies

Next.js
React
TypeScript
Tailwind CSS
Vitest
Playwright
Vercel

Architecture

A Next.js App Router site written in TypeScript and styled with Tailwind CSS design tokens. Project data lives in one file and is read at build time, so pages are generated statically. GitHub pushes to master deploy automatically on Vercel.