diff --git a/README.md b/README.md index d3611d7..285683b 100644 --- a/README.md +++ b/README.md @@ -231,15 +231,36 @@ countdown. ## Hosting on Cloudflare -The build output in `dist` is a static site, so it runs on Cloudflare Pages as -it is. Use `npm run build` as the build command and `dist` as the output -directory. Set the `VITE_` variables as build variables, because Vite writes -them into the bundle at build time. - -The routes are handled in the browser by React Router. Pages serves -`index.html` for any path that is not a file when the site has no top level -`404.html`, so deep links such as `/seat-picker` work without a `_redirects` -file. +The build output in `dist` is a static site, served on Cloudflare Workers as +static assets. `wrangler.jsonc` sets it up: + +```sh +npm run build +npx wrangler deploy +``` + +Set the `VITE_` variables before `npm run build`, because Vite writes them into +the bundle at build time. + +The routes are handled in the browser by React Router. `wrangler.jsonc` sets +`not_found_handling` to `single-page-application`, so a deep link such as +`/seat-picker` serves `index.html` and the app takes it from there. + +`npx wrangler deploy` creates your own Worker named `seatlayer-react-example`, +with no custom domain. Rename it in `wrangler.jsonc` if you like. + +### Hosting our copy + +The live demo at examples-react.seatlayer.io is this repository deployed with +the `hosted` environment in `wrangler.jsonc`, which sets the Worker name +`seatlayer-examples-react` and the custom domain: + +```sh +npm run build +npx wrangler deploy --env hosted +``` + +You do not need this environment for your own copy. Add `?embed=1` to any route to hide the navigation and the route heading, so the example sits cleanly in an iframe. diff --git a/wrangler.jsonc b/wrangler.jsonc index 5215cf1..8e99ff3 100644 --- a/wrangler.jsonc +++ b/wrangler.jsonc @@ -1,12 +1,20 @@ { - // Hosted copy of this example on Cloudflare Workers static assets. + // This example on Cloudflare Workers static assets. // Build first (npm run build), then deploy with: npx wrangler deploy + // That deploys your own copy under the name below, with no custom domain. + // The "hosted" environment is the SeatLayer copy on + // examples-react.seatlayer.io; you do not need it. "$schema": "node_modules/wrangler/config-schema.json", - "name": "seatlayer-examples-react", + "name": "seatlayer-react-example", "compatibility_date": "2026-09-01", "assets": { "directory": "./dist", "not_found_handling": "single-page-application" }, - "routes": [{ "pattern": "examples-react.seatlayer.io", "custom_domain": true }] + "env": { + "hosted": { + "name": "seatlayer-examples-react", + "routes": [{ "pattern": "examples-react.seatlayer.io", "custom_domain": true }] + } + } }