Demo

From empty workspace to a working API key.

The question worth answering before you adopt anything is how much work is this. So here is the whole thing, uncut and in real time: signing in, creating an Application, minting a key, configuring auth, and proving it works. Forty-two seconds, no narration, nothing sped up.

A real browser session, recorded against a local stack — not a mockup. Silent, so nothing starts making noise at you. The API key is blurred in the recording; nothing here is a live credential.

What happens, in order

  1. Sign in to the operator panel

    One operator account, one workspace. No install step before this — the panel is part of the stack you already run.

  2. Create an Application

    Name, slug, environment. An Application is a self-contained pool of end users with its own auth config, keys and billing.

  3. Mint a server API key

    Shown exactly once, then only a SHA-256 hash is stored. In the recording the value is blurred — the panel itself shows it in full.

  4. Configure auth and redirect URLs

    Turn on email + password and magic link, add the callback URL your app returns to. Changes apply to new sign-ins immediately.

  5. Prove it works

    Three real calls with the key just minted: the Application resolves, an end user signs up, and their token comes back from /api/v1/auth/me.

How this recording is made

It is a scripted Playwright session driving a real Chromium against a real API and panel booted from this repository — not a screen capture and not a mockup. One command regenerates it from scratch: pnpm demo:record. The database it runs against is created for the recording and dropped afterwards.

That matters for two reasons. It can be re-cut in minutes when the panel changes, so it should not drift into showing a product that no longer exists. And because the stack is disposable and local, there is no way for a real customer's data or a live credential to end up in the frame — the API key on screen is blurred, and the workspace it belonged to no longer exists.

This is the Rekey side of the job. For the other side — what you type in your own project — the framework walkthroughs go from an empty directory to a working sign-in in Next.js, and to a token-protected route in NestJS.

Prefer to read it? The operator-panel walkthrough covers the same ground in writing, with screenshots of every page.

Watch: configuring an Application | Rekey