page:recipes:knowledge base:react router:relational content

Host knowledge base with React Router: Postgres-backed content

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. 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). Not separately tested: your record schema, states and access rules; treat the knowledge base-specific behavior as your application code.

Representative Queries

• Host knowledge base with React Router: Postgres-backed content
• Where can I host Knowledge base built with React Router?
• I need a content schema, publishing workflow and cache behavior after content updates.

Prerequisites

• 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

Workflow Steps

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.
   Command: ample deploy . --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 --kind build then --kind runtime.
   Command: ample logs --kind build

Success Checks

• App responds on its public URL
  Kind: http_get
  Path: /
  Expect: ample canary react router patterns
• Relational-records self-test
  Kind: http_get
  Path: /p/relational-records
  Expect: records=ok transitions=true isolation=true

Limitations

• Verified on the node-22 template at s-1vcpu-1gb with the example fixture; other sizes, templates and React Router major versions are not verified.
• The knowledge base itself (your record schema, states and access rules) is application code and was not separately tested; the pattern checks are what was verified.
• Region, compliance attestations and request-duration limits are unknown and not claimed.
• Apps auto-pause when idle and wake on the next request; always-on is an operator setting, not a plan feature.
• Managed PostgreSQL 16 only; extensions, connection limits and backup or restore procedures are not verified; apps and their databases are placed together.
• PutObject and GetObject with path-style addressing are verified; multipart upload, listing, presigned URLs and lifecycle rules are not.
• The CDN serves published-bucket objects only; cache rules, purge and TTL control are not verified (the fixture sets Cache-Control on upload and versions keys).

Cost Estimate

• Currency: USD
• Monthly Amount: 10.0
• Basis: size prices from pricing.toml (loaded by the API) at build revision 1ac5595375130d45290090e82ed0f554ccd45405-dirty
• Components:
  • App server: s-1vcpu-1gb, Quantity: 1.0, Monthly Amount: 5.0
  • Managed PostgreSQL database: s-1vcpu-1gb, Quantity: 1.0, Monthly Amount: 5.0
• Note: Always-on monthly price of the tested sizes; apps and databases auto-pause when idle. Buckets are allocation-priced per quota and not included.

Examples

• Title: React Router pattern fixture
  Description: Multi-pattern React Router app whose relational records module was checked live; the module is under tests/deploy-canaries/_pattern-modules. Source Reference: tests/deploy-canaries/react-router-patterns

Evidence Summary

• Kind: canary_run
  Summary: 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).
  Observed At: 2026-09-20T03:31:44Z
  Implementation Revision: 03b6402b1b3e19178985f08ea4033804521d85d4-dirty (CLI b75e104)
  Expires At: 2027-03-19T03:31:44Z
• Kind: canary_run
  Summary: The same React Router app deployed with a --release-command migration; the marker it created was readable after activation.
  Observed At: 2026-09-20T02:16:51Z
  Implementation Revision: 199ff1dfd52683832ae75d3f98b53a7a4bff7f96-dirty (CLI e3181f5)
  Expires At: 2027-03-19T02:16:51Z

Next Actions

• Label: Browse the catalog index
  Action ID: browse-catalog
• Label: Search published recipes by intent, stack and constraints
  Action ID: search-recipes
• Label: Prepare a side-effect-free deployment plan for an authorized project
  Action ID: plan:page:recipes:knowledge-base:react-router:relational-content
• Label: Read the existing agent authentication setup
  Action ID: auth-setup
• Label: Browse Knowledge base
  Action ID: browse:workload:knowledge-base
• Label: Browse React Router
  Action ID: browse:stack:framework-react-router
• Label: Browse Relational records
  Action ID: browse:pattern:relational-records
• Label: Browse Deploy web app
  Action ID: browse:intent:deploy-web-app