Demos next to the blog

Every side project ends up with the same problem: a demo that needs to be somewhere, and a blog post that needs to link to it. The usual answer is a scattering of hostnames — three Vercel projects, a Netlify drop, a screenshot on imgur because the demo's cold start was too slow to share.

This site does it the boring way: demos live under /demos/<name> on the same domain as the writing.

How it works

Each demo is a Next.js route. The registry in src/lib/demos.ts lists what exists; the /demos page renders cards from it. Adding a demo is:

1. Create src/app/demos/<slug>/page.tsx (and a client component if it needs state).
2. Add an entry to src/lib/demos.ts.
3. Commit. The card appears on /demos and the route is statically generated at build time.

No separate hosting, no separate deploy, no separate DNS. The demo and the post that explains it share a cache, a domain and a build.

What this buys

• One build. bun run build produces the blog and every demo in a single static output.
• One link. A post can deep-link to /demos/theme-explorer and the reader never leaves the site.
• One theme. Demos inherit the same matte-white tokens as the blog, so a demo embedded in a post looks like part of the post.

The theme explorer walks the palette; the ui kit shows the stock shadcn components on it.