Interactive demoAPIsCore
Internal API route
Call our own JSON endpoint, watch it validate the payload with Zod, and inspect the real HTTP exchange.
Built withRoute HandlersZodfetch
Before you try it
What it needs
Nothing to configure. It runs the same everywhere.
Mode right now
ReadyThe provider is configured here; nobody has watched the real path succeed on this deployment yet.
A safe failure to try
Turn the simulated latency up and send: the request shows its pending state, and the typed response still arrives.
Request
These fields become the JSON body. The server validates them again with the same Zod schema before doing any work.
38 / 280 characters
POST /api/echo
Content-Type: application/json
{
"message": "Server components render on the server",
"transform": "upper",
"delayMs": 400
}Response
Every one of the four states below is rendered explicitly. A screen with no designed empty or error state is a screen that will eventually show a blank rectangle.
No request sent yet. Press Send request.
What this demonstrates
- Route Handlers turn a file into an HTTP endpoint
- Never trust client input: the server re-validates everything
- Meaningful status codes (400 for bad input, 422 for semantic failure)
- Structured error responses a UI can actually render
Where the code lives
src/experiments/internal-api/demo.tsxRegistered in src/experiments/registry.ts and loaded on demand by loader.tsx.