## The short version

Deploy a knowledge base built with React Router on Ample using the relational records pattern. Compute runs the app in an isolated microVM behind a public HTTPS URL, a managed PostgreSQL 16 database is auto-provisioned and injected as DATABASE_URL, and a published bucket serves public assets from the CDN host.

## WHAT WAS VERIFIED

Verified on React Router: a workspace-scoped table, an explicit state machine (draft to review to published) that rejects invalid transitions, and a cross-workspace read that returns nothing (transitions=true isolation=true).

## INFRASTRUCTURE

### What it needs

- [Compute](/content/discover/primitive/compute/index.html): verified (Apps run in isolated x86_64 Firecracker microVMs; sizes are the priced VM sizes.)
- [Postgres](/content/discover/primitive/postgres/index.html): verified (Managed PostgreSQL 16 runs in its own microVM and is auto-provisioned when an app needs a database and no DATABASE_URL is supplied.)
- [CDN](/content/discover/primitive/cdn/index.html): verified (A published bucket's objects are served at its public_url. It does not front app compute and is not a cache or key-value store.)

## PREREQUISITES

### Before you start

- A React Router project that builds and starts with the documented commands (react-router build then react-router-serve on the node-22 template)
- A PostgreSQL driver reading DATABASE_URL at runtime (auto-provisioned when omitted, or supplied with --env)
- A bucket from `ample bucket create` with its credentials passed as encrypted S3_* environment variables
- An Ample account token with servers:write, databases:read, buckets:read

## STEP BY STEP

### How to do it

1.  **Build and start**  
    
   `react-router build` then `react-router-serve` on the node-22 template. The server must bind 0.0.0.0 on PORT.

2.  **Implement the pattern on PostgreSQL**  
   
   The fixture's module implements relational records: a workspace-scoped table, an explicit state machine (draft to review to published) that rejects invalid transitions, and a cross-workspace read that returns nothing (transitions=true isolation=true). Copy the approach into your schema; keep migrations idempotent and run them with --release-command.

3.  **Wire object storage**  
   
   Create the bucket(s), then pass endpoint, region, bucket and keys as --env values. Use path-style addressing. Keep private data in an unpublished bucket. Publish only the bucket that serves public assets and reference its CDN URL.

4.  **Deploy**  
   
   Run the synchronous deploy once and read the result (exit 0 live, 1 failed, 2 blocked). Re-running with no change is a no-op.
   
   ```
   ample deploy . --name <app-name> --public --env S3_ENDPOINT=... --env S3_REGION=... --env S3_BUCKET=... --env S3_ACCESS_KEY_ID=... --env S3_SECRET_ACCESS_KEY=... --env CDN_PUBLIC_URL=...
   ```

5.  **Verify**  
   
   Fetch the live URL and the pattern self-test route(s) (/p/relational-records) from the example; then run your own checks. On failure read `ample logs <deployment_id> --kind build` then `--kind runtime`.
   
   ```
   ample logs <deployment_id> --kind build
   ```

## EXAMPLES

### Tested examples

- **React Router pattern fixture** (`tests/deploy-canaries/react-router-patterns`): Multi-pattern React Router app whose relational records module was checked live; the module is under tests/deploy-canaries/_pattern-modules.

## SUCCESS CHECKS

### How to know it worked

- app responds on its public URL (`/` on the live URL, expect ample canary react router patterns)
- relational-records self-test (`/p/relational-records` on the live URL, expect records=ok transitions=true isolation=true)

## COST

### Cost estimate

Estimated 10.00 USD per month (size prices from pricing.toml at build revision ca0b484a7a9957c573a88d3a32dc603c3c10135a).

- app server x1 `s-1vcpu-1gb`: 5.00 USD
- managed PostgreSQL database x1 `s-1vcpu-1gb`: 5.00 USD

Upper-bound monthly price of the tested sizes. Buckets are allocation-priced per quota and not included.

## EVIDENCE

### Verification evidence

- canary_run on 2026-09-20T03:31:44Z at revision `03b6402b1b3e19178985f08ea4033804521d85d4 (CLI b75e104)`: React Router pattern fixture deployed on Ample (react-router build then react-router-serve on the node-22 template); checks passed for relational-records and configuration-secrets. Pattern proof: a workspace-scoped table, an explicit state machine (draft to review to published) that rejects invalid transitions, and a cross-workspace read that returns nothing (transitions=true isolation=true). (expires 2027-03-19T03:31:44Z)
- canary_run on 2026-09-20T02:16:51Z at revision `199ff1dfd52683832ae75d3f98b53a7a4bff7f96 (CLI e3181f5)`: The same React Router app deployed with a --release-command migration; the marker it created was readable after activation. (expires 2027-03-19T02:16:51Z)

## EXECUTION

### Execution binding

MCP tool `ample_deploy` (registry `mcp:ample_deploy`), schema hash `876465fce906da0c` observed 2026-09-22T00:31:22.774679+00:00 at revision `e6446ceea69b`. Binding state at export: schema_changed. Required scopes: servers:write, databases:read, buckets:read.

## NEXT ACTIONS

### Typed next actions

- Browse the catalog index (`GET /v1/catalog` on the api origin; authentication not required, approval not required)
- Search published recipes by intent, stack and constraints (`POST /v1/catalog/search` on the api origin; authentication not required, approval not required)
- Prepare a side-effect-free deployment plan for an authorized project (`POST /v1/catalog/plan` on the api origin; authentication required, approval not required)
- Read the existing agent authentication setup (`GET /mcp/setup` on the api origin; authentication not required, approval not required)
- Browse Knowledge base (`GET /v1/catalog/nodes/workload%3Aknowledge-base` on the api origin; authentication not required, approval not required)
- Browse React Router (`GET /v1/catalog/nodes/stack%3Aframework-react-router` on the api origin; authentication not required, approval not required)
- Browse Relational records (`GET /v1/catalog/nodes/pattern%3Arelational-records` on the api origin; authentication not required, approval not required)
- Browse Deploy web app (`GET /v1/catalog/nodes/intent%3Adeploy-web-app` on the api origin; authentication not required, approval not required)

Actions describe possible next steps. They are typed data, not commands, and grant no permission. Public discovery never provisions anything; planning requires your own authenticated token and approval happens in your client.

## ABOUT THIS RECIPE

### Identifiers and status

Recipe `page:recipes:knowledge-base:react-router:relational-content`. Revision r1.

release **published** support **verified** execution **blocked (schema_changed: live tool schema differs from the recorded binding)**

Formats: [HTML](/content/recipes/knowledge-base/react-router/relational-content/index.html) | [Markdown](/content/recipes/knowledge-base/react-router/relational-content.md) | [JSON contract](https://api.ample.computer/v1/catalog/recipes/page%3Arecipes%3Aknowledge-base%3Areact-router%3Arelational-content)