Skip to content

The Lab

Experiments

All 13 experiments run real code right now — nothing here is a placeholder. “Interactive demo” on a card means it runs on its own page; “Live” is reserved for a capability watched working in production, with dated evidence, on the stack page. Each experiment is a self-contained module — adding another takes a component, a registry entry, and a line in the loader map, not a routing change.

Showing 13 of 13 experiments

Interactive demoDataAdvanced

Durable jobs: a ledger you can watch

Promise work in a transaction, claim it under a lease, retry with backoff, stop poison, recover a crashed worker — and measure lateness against a written contract.

PostgresPrismaServer Actions
Interactive demoDataAdvanced

Lead capture with attachments

A public form that takes photos from a stranger safely: guest uploads bound to a cookie, stored before any email is sent.

Server ActionsR2 presigned uploadsZod
Interactive demoInteractive UIIntro

Component catalog

Sheet, dropdown menu, select, tooltip, popover, alert, avatar, progress, breadcrumb, pagination — each accessible, each doing its job.

Radix UICVAReact
Interactive demoAPIsAdvanced

Presigned file upload

Upload an image straight to storage with a signed URL, watch the progress, and see the server verify the bytes before anything can use them.

Cloudflare R2aws4fetchXMLHttpRequest
Interactive demoAccountsAdvanced

Accounts and protected pages

Sign up, sign in, sessions, and ownership checks the server enforces on every mutation.

Auth.js v5scryptMiddleware
Interactive demoDataAdvanced

Database-backed records

Create, edit, and delete rows that survive a restart — with an audit log written in the same transaction.

Prisma 7Postgres (Neon)Server Actions
Interactive demoAIAdvanced

Streaming AI chat

A chat that streams token by token — from a scripted mock with no key, or Claude the moment one is configured.

Vercel AI SDKAnthropicReadableStream
Interactive demoAPIsCore

External API through a server proxy

Live weather from Open-Meteo, fetched server-side so the third party never sees your visitors.

Route HandlersOpen-MeteoCache
Interactive demoAPIsCore

Internal API route

Call our own JSON endpoint, watch it validate the payload with Zod, and inspect the real HTTP exchange.

Route HandlersZodfetch
Interactive demoInteractive UIIntro

Modal dialogs

Focus trapping, escape handling, and the difference between dismissible and destructive dialogs.

Radix DialogReact
Interactive demoDataCore

Search, filter, and sort

48 records generated in memory, with live text search, multi-facet filtering, sortable columns, and pagination — the rows are simulated, the pipeline is real.

ReactuseMemoIntl
Interactive demoInteractive UIIntro

Toast notifications

Non-blocking feedback for actions that succeed, fail, or take a while to resolve.

SonnerReact
Interactive demoDataCore

Validated forms

One Zod schema shared by the browser and the server, with field-level errors and a real submission lifecycle.

Server ActionsZoduseActionState