# Deploy React

A React single-page app is detected from its dependencies and build config (`vite.config.ts` for Vite, `react-scripts` for Create React App) and deploys as a static site: `npm run build` fills the output directory, and the CDN serves it with [free bandwidth](/billing/pricing#static-sites). No server, no region, no cold starts.

## Build

| Setup | Output directory |
| --- | --- |
| Vite | `dist` |
| Create React App | `build` |

Detection knows both; override in [Build settings](/create/build-settings#output-directory) if your config moves it. The install step follows your lockfile - see [How detection works](/platform/frameworks#how-detection-works).

## Environment variables

Static builds run [with the environment's variables set](/platform/environment-variables#build-time-and-runtime), so build-time inlining works as usual: `VITE_*` (Vite) or `REACT_APP_*` (CRA). Each [environment](/platform/preview-environments) builds with its own values - a preview can point at a staging API while production uses the real one.

> [!WARNING]
> Inlined values ship to every browser. API base URLs and public keys are fine; secrets are not - those belong on the server side of whatever API the app calls.

## Need a server?

The React app itself needs none. When the backend is yours too, deploy it as its own app - [Express, FastAPI, Go, and friends](/platform/frameworks#backend) - and keep both in one repository with two [root directories](/create/application-settings#root-directory). Server-rendered React is [Next.js](/platform/frameworks/nextjs) or [Remix](/platform/frameworks/remix).

## Related

- [Build settings](/create/build-settings): Install, build, and output configuration.
- [Environment variables](/platform/environment-variables): Per-environment values at build time.
- [Custom domains](/platform/custom-domains): Your own hostname on the CDN.