Step 2 of 10

Phase 1 — Install and configure

Time: ~15 minutes
Prerequisites: Phase 0 complete (routing inventory exists), a Restormel Keys account
You'll need: Terminal access, your app's package manager (pnpm, npm, or yarn), access to the Dashboard

This phase gets @restormel/keys into your app and Dashboard resources (project, environment, Gateway Key). Restormel Doctor must exit 0 with only the core package for Phases 1–4 (UI packages are optional; doctor warns, does not fail). See repo docs/reference/npm-packages.md for npm scope and pnpm monorepo installs. Cloud env vars are verified in Phase 2.

pnpm workspace — Run installs in the app directory (or pnpm add --filter <app> @restormel/keys). Root-only pnpm add -w only if the root is your app.
Step 1.1 — Install the packages

Required: @restormel/keys. Phase 5 UI (keys-svelte, keys-react, keys-elements) — add when on npm. Verify with npm view @restormel/keys-svelte version before relying on install.

Headless / SvelteKit Phases 1–4:

bash
pnpm add @restormel/keys

Next.js + UI (Phase 5, only if npm view confirms packages):

bash
pnpm add @restormel/keys @restormel/keys-react @restormel/keys-elements

SvelteKit + UI (Phase 5, only if npm view confirms packages):

bash
pnpm add @restormel/keys @restormel/keys-svelte
TipFramework compatibility. Dogfooding: headless + doctor is enough until UI packages publish.

You'll see

The packages appear in your package.json dependencies. No build errors.

How to test

bash
# Confirm the package installed correctly
node -e "const k = require('@restormel/keys'); console.log('OK:', Object.keys(k).length, 'exports')"

If you use ESM ("type": "module" in your package.json):

bash
node --input-type=module -e "import { createKeys } from '@restormel/keys'; console.log('OK: createKeys is', typeof createKeys)"
Step 1.2 — Config (CLI or manual)

Option A — npx @restormel/keys-cli init when the package resolves on npm. If 404, use Option B.

Option B — Create restormel.config.json in the app root:

json
{
  "framework": "sveltekit",
  "providers": []
}

Use framework: next | sveltekit | react | astro | none.

How to test

bash
npx @restormel/doctor

Doctor requires @restormel/keys + config. Optional UI warnings are OK for headless setups.

Step 1.3 — Create a project in the Dashboard
Human step — Sign-in uses GitHub OAuth. Coding agents and headless CI cannot complete this without a signed-in operator. Create project, environment, and Gateway Key in a browser; copy IDs into secrets locally.

Open the Dashboard and sign in with GitHub.

  1. Create a workspace (if you don't have one). This is your top-level organisational container. Name it after your company or team.
  2. Create a project. Name it after your app (e.g. "My Writing Tool"). The project is where routes, policies, and keys live.
  3. Create an environment within the project: production. You can add staging later. The environment scopes routes and policies to a deployment context.
Dashboard — Workspace → Projects → Create project → name it → EnvironmentsCreate environment → name it production.

You'll see

The project detail page in the dashboard with: project name and ID; an "Environments" section showing production; empty "Routes" and "Policies" sections (you'll fill these in Phases 3–4); an "API Keys" section (you'll generate a Gateway Key next).

How to test

The project detail page loads without errors. The environment production is listed.

Step 1.4 — Generate a Gateway Key

Still in the Dashboard, on your project detail page:

  1. Click Generate API key (or navigate to the API Keys section).
  2. Copy the full key immediately. It has the format rk_… and is shown only once.
  3. Store it securely. This is your Gateway Key — the credential your backend uses to authenticate to the Restormel resolve API.
Security — The Gateway Key is a secret. Store it in your environment variables or secret manager. Never commit it to your repo, paste it into a coding agent, or log it in application output.

You'll see

A key displayed once with a "Copy" button. After you navigate away, you see only the key prefix (e.g. rk_a3f…) in the dashboard — the full key is not retrievable.

How to test

You test the key works in Phase 2 when you make your first resolve call. For now, confirm it's stored:

bash
# Add to your .env (gitignored) — NOT .env.example
# RESTORMEL_GATEWAY_KEY=rk_your_key_here
# RESTORMEL_PROJECT_ID=your_project_id_here
# RESTORMEL_ENVIRONMENT_ID=production

Update .env.example with placeholder names (no values):

bash
# .env.example
RESTORMEL_GATEWAY_KEY=
RESTORMEL_PROJECT_ID=
RESTORMEL_ENVIRONMENT_ID=
Step 1.5 — Configure provider credentials (optional)

This step is about choosing how your stack reaches providers. Restormel is designed to work with external gateways (OpenRouter, Vercel AI Gateway, Portkey) and with builder-managed direct provider keys (env vars / secret manager). Restormel does not need to custody raw provider secrets by default.

Option A — Gateway-backed provider access (recommended)

Keep your gateway as the provider access layer, and use Restormel for routing, policies, health, analytics, and progressive rollout. See: OpenRouter, Vercel AI Gateway, Portkey.

Option B — Builder-managed direct providers

Keep provider keys in your own environment (e.g. OPENAI_API_KEY, ANTHROPIC_API_KEY) or secret manager. Restormel resolve tells you which provider/model to call; your app supplies provider access from its own infrastructure.

You'll see

You have a clear provider access mode for your stack (gateway-backed or builder-managed direct). If you are using a gateway, your app still uses the gateway’s auth and endpoint; Restormel adds the control layer.

How to test

No code-level test in this phase. You’ll verify your chosen mode in Phase 2 when you make your first resolve call.

Step 1.6 — Run Restormel Doctor again

Now that you have a config (and optionally env vars), run the doctor check again:

bash
npx @restormel/doctor

You'll see

Restormel Doctor checks framework detection, package versions, and config validity. Example output:

text
✔ Framework detection — SvelteKit
✔ Core package (@restormel/keys) — installed
○ UI packages (Phase 5 — optional) — not installed: @restormel/keys-svelte — OK for headless
✔ restormel.config.json — found

OK

Cloud env vars (RESTORMEL_GATEWAY_KEY, RESTORMEL_PROJECT_ID, RESTORMEL_ENVIRONMENT_ID) are not validated by the CLI. You confirm they work in Phase 2 when you call the resolve endpoint.

How to test

bash
npx @restormel/doctor && echo "PASS" || echo "FAIL"
Pitfall — Doctor fails only if @restormel/keys or config is missing. UI package lines are warnings. Phase 2 needs Gateway Key + IDs from the Dashboard (human step).
Step 1.7 — Add env var placeholders to .env.example

Make sure your repo's .env.example documents the new variables so collaborators know what to set:

bash
# .env.example — Restormel Keys integration
RESTORMEL_GATEWAY_KEY=
RESTORMEL_PROJECT_ID=
RESTORMEL_ENVIRONMENT_ID=
# Optional: feature flag for phased rollout (see Phase 0)
USE_RESTORMEL_KEYS=false

Prompts for this phase

These are optional and collapsed by default. Use them if you're implementing Phase 1 with a coding agent.

Checkpoint checklist: mark each step complete as you finish it.

Checklist

Checkpoint

You now have:

  • Restormel Keys packages installed in your project.
  • A restormel.config.json that matches your framework.
  • A project and environment created in the Restormel Dashboard.
  • A Gateway Key stored in your .env (gitignored).
  • Restormel Doctor passing.

Your app still runs on the old routing path (the feature flag from Phase 0 is still false). Nothing has changed in your application behaviour.