About this site
Architecture
corslabs.com is a single-page-app-free educational site built with Astro 5 and MDX, with interactive demo islands rendered by Preact on the client. Every demo fires a real, unproxied cross-origin fetch against a live API — nothing is simulated or proxied away during development, so what you see in the browser is what a real CORS conversation looks like.
The API is a Hono application running on a single AWS Lambda, fronted by API Gateway HTTP API with its own custom domains — deliberately not behind CloudFront, so the site and its API are genuinely cross-origin in every environment. A DynamoDB single-table store (on-demand capacity, TTL-based expiry) backs the report channel that lets each page show what the server actually received and sent.
All infrastructure is defined as CDK (TypeScript),
with one parametrized stack per environment deployed to
eu-north-1. The site is served from CloudFront
(S3 origin), and a dedicated /same-origin-api/* behavior
proxies to the API's own domain — the control group for the origin
comparator, and the pattern used as a case study on page 12.
The codebase is a pnpm workspaces monorepo with five
packages: shared (schemas, the origin/site model, scenario
enums — the contract between site and API), api (the Hono
app and Lambda handler), site (the Astro frontend),
infra (CDK infrastructure), and e2e
(cross-engine Playwright tests against the deployed staging
environment). Every package is typechecked together at the root level
— a type error in shared that breaks api
fails the build, not a runtime surprise.
The deliberate irony
Every live demo on this site teaches you how CORS works by making a
real cross-origin request from www.corslabs.com to
api.www.corslabs.com — a different host, therefore a
different origin. The same mechanism this entire site exists to explain
is what keeps its own demos running. If the API ever stopped sending
Access-Control-Allow-Origin, every page with a demo would
break at once.
That's not a flaw — it's the point. The site eats its own dogfood.
There is no dev-server proxy hiding CORS from the developers (with one
explicitly scoped exception: the /same-origin-api/*
CloudFront behavior, which is itself a teaching tool — the same-origin
control group on page 1 and the case study on page 12). Every other
fetch goes straight to the real API, cross-origin, through the
browser's own CORS enforcement, in every environment including local
development.
Who built this
corslabs.com is a free, pro-bono developer-education project built by Precisit, credited via the footer branding on every page.
The site was built start-to-finish in July 2026 by a single developer (Magnus Lundstedt at Precisit) working alongside AI pair-programming tools, following a practice that deliberately parallelized independent tasks across multiple agents and model providers — the same discipline the site itself teaches: verify your assumptions, check your sources, and never trust a single implementation without review.