Colophon
How this site is built
A fast, low-maintenance portfolio. Authored in Notion, built with Astro, hosted on Vercel.
Astro
Static site framework. Ships almost no JavaScript, so pages load fast.
Tailwind CSS
Utility-first styling, with a small custom theme for color and type.
TypeScript
Types across the content loaders and helpers.
Notion
The CMS. Projects and the tech stack are authored as database rows.
GitHub
Source of truth for the code. Vercel builds from it on every push.
Vercel
Hosting on the free tier. Every push to the main branch deploys.
Make
Watches Notion and pings a deploy hook so edits go live on their own.
The idea
I wanted a portfolio that is fast, cheap to run, and easy to keep current. The rule I set: adding a project should mean adding a row in Notion, not editing code. Everything else follows from that.
Content lives in Notion
Two Notion databases drive the site. A Portfolio Projects database holds each case study (title, tagline, category, tools, key result, and the write-up in the page body). A Tech Stack database holds the tools on the homepage, including a Color field that sets each chip’s brand color. At build time the site reads those databases through the Notion API and turns them into pages.
It always builds
Notion image links expire, so during the build every cover and in-body image is downloaded and cached locally. If Notion is not configured, the site falls back to a small set of seed projects, so it never breaks and I can work on it offline.
Design system
A single chip component powers the stack strip and the tags on each project card. Each chip is tinted with its tool’s brand color and rendered as a glossy pill, with a near-black badge treatment for logos like GitHub, Vercel, and Notion. The whole site adapts to light and dark mode.
Code and deploys
The code lives on GitHub. Vercel is connected to the repository and hosts the site free, deploying automatically on every push to the main branch. For content changes that never touch code, a Make scenario watches Notion and calls a Vercel deploy hook, so editing a project in Notion rebuilds the live site within a couple of minutes.
Domain
The domain is registered at Squarespace and pointed at Vercel with a couple of DNS records. Vercel handles SSL, and the www address redirects to the bare domain.
The short version
Add a row in Notion, and a new project appears on the site a minute later. No hand-editing, no manual redeploys, and no hosting bill beyond the domain.