React Router + Postgres

react-router-postgres

Cloudflare's React Router + Postgres SSR template — a books library server-rendered by React Router v7, its page loaders calling a Hono Worker's own BooksService entrypoint over a service binding to itself, the books in Postgres reached through Cloudflare Hyperdrive — running on Cloudflare Workers + Static Assets through the Cloudflare Vite plugin, with the database a Supabase Postgres project, both provisioned by Terraform through Orun and the schema and its books applied by Orun's db-migrate, and packaged as an Orun baseline: one command takes a new product from nothing to live on stage and prod, in its own repository, under its own name, in ONE landing.

The template's code is the code: its routes, components, styles, covers and BooksService are as upstream wrote them, JavaScript included. What the port changes is what an unattended deployment forces: the database is a Supabase project per environment instead of a Neon one created by hand, its init.sql — the table and the nine books — is three migrations applied before the Worker deploys instead of a script pasted into an SQL editor, and every table in public has row-level security, so Supabase's Data API serves none of it. The self-binding stays: the Worker binds its own per-environment name, rendered into its config per lane. Two additions: the product's name in one place (apps/web/app/lib/site.ts, the library's heading and the page's <title>), and /api/health, which the deploy's smoke and the bootstrap's probes read. What the baseline adds is everything needed to make a copy of it somebody else's. See specs/epics/react-router-postgres for the design, the milestones and the as-built status, including every departure.

Instantiating a product

git clone --depth 1 --branch <baseline-tag> https://github.com/sourceplane/react-router-postgres
cd react-router-postgres
orun new --blueprint repo-blueprint.yaml --out ~/products/acme-books --run-hooks --resume \
  --set reponame=acme-books --set productname="Acme Books" \
  --set githuborg=acme-inc --set subdomain=<workers-dev-subdomain>

Or, once the platform's registry lists it, from the Orun console (Baselines → react-router-postgres → Build). Two phases: 01-product creates the repository, mints the five brokered credentials (Cloudflare and Supabase) and lands the whole product as one pull request, whose convergence on main provisions and deploys it per environment in a fixed order —

supabase ──▶ cloudflare-hyperdrive ──▶ db-migrate ──▶ web

— each edge mode: enforced on a push to main and advisory on a pull request; then 02-docs records the live deployment from probed facts. BOOTSTRAP.md is the operator guide; docs/phases/ has a page per phase. The Supabase organization needs room for two projects (stage and prod) — the free plan's limit.

The new repository receives the product only — the app, the Terraform roots, the migrations, the tests, its CI, its tooling, a README of its own and its operating contract — renamed throughout to the product's name, repository, Worker, Supabase project and Hyperdrive config. None of this repository's machinery ships. The card asks for no third-party key: the app uses none.

What is here (the product)

Getting started

pnpm install
pnpm run wire:fixture   # re-render both wrangler configs from their templates (committed; this changes nothing)
pnpm typecheck
pnpm lint
pnpm test
pnpm build              # react-router build → apps/web/build/{server,client}

The build needs no database. Running it locally — a Postgres on localhost:54322 (supabase start), pnpm --filter @app/web db:migrate:local, then react-router dev or the built Worker under wrangler dev — is in the product's README (.baseline/product/README.md), which is what a product built from here carries.

How it maps to Cloudflare's template

CI

Credit

The app is Cloudflare's react-router-postgres-ssr-template, MIT-licensed; apps/web/LICENSE carries the licence.