Colophon

This site is a small, fast, and opinionated home on the web. Here is the stack and the thinking behind how it is built.

Foundation

• Next.js App Router with React 19 and TypeScript for the core application.
• Tailwind CSS v4 plus a lightweight global stylesheet for custom utilities and animations.
• Fonts are loaded with next/font: Playfair Display for titles and EB Garamond for body text.

Content and publishing

• Content lives in the repo under the content directory as Markdown and MDX.
• Velite compiles the content at build time, with MDX support for richer posts and pages.
• Headings get automatic anchors, and code blocks are highlighted with Shiki via rehype-pretty-code.
• The blog table of contents is generated from MDX headings and kept in sync on scroll for quick navigation.

Motion and UI

• The site theme and color palette are hand-crafted by me.
• Framer Motion powers the drawer, subtle reveals, and interactive transitions.
• Icons come from lucide-react, with custom SVG assets in public.

Data and integrations

• The Spotify "Now Playing" module is backed by a server route that calls the Spotify API for currently playing song.
• The inline weather badge uses the OpenWeather API, cached at the route level.

Deployment

• The site deploys automatically to Vercel on every push to main, with continuous integration running on pull requests.
• End-to-end tests run with Cypress to catch regressions before deployment.

Performance notes

The site keeps dependencies minimal, relies on static content where possible, and uses Next.js image optimization for media.