# React app hosting

Host a React app built with Vite: deploy dist/ with one command, and React Router deep links work with spa = true or one switch. Free to try, no account.

On the web at https://lobsite.com/hosting/react

```sh
npm run build && npx lobsite
```

Vite builds into dist/ (Create React App into build/), and npx lobsite finds it and deploys it.

Most React apps today are built with Vite into a folder of static files: one `index.html` and the JavaScript that draws every page. Lobsite hosts that folder. Run `npm run build`, then `npx lobsite`, and the app is live at a `*.lobsite.app` address with HTTPS. React Router deep links work once single-page mode is on.

## How it works

1. **Build the app** with `npm run build`. A Vite project writes `dist/`; an older Create React App project writes `build/`.
2. **Run `npx lobsite`** in the project. It finds the build folder and deploys it. The first deploy needs no account and lasts 6 hours.
3. **Turn on single-page mode** for React Router: `spa = true` in `lobsite.toml`, or **Single-page app** in the site's settings. Keep the site with the claim link, in a free account.

## React Router and deep links

With `createBrowserRouter` or `<BrowserRouter>`, addresses look like `/orders/42`. Clicking a link works anywhere, because React Router changes the page in the browser. Opening that address directly, or reloading it, asks the server for `/orders/42`, which isn't a file. Single-page mode answers it with your `index.html`, and React Router draws the right page.

- **`<HashRouter>`** (addresses like `/#/orders/42`) works without single-page mode, since the server only ever sees `/`. Browser routes look better and are what search engines expect.
- **React Router's framework mode** with `ssr: false` builds a single-page app too. With `prerender` set, the listed pages are written as their own HTML files, and single-page mode covers the rest.
- **TanStack Router** and **wouter** work the same way as React Router.

The deploy shows a tip when it finds a router in `package.json` and single-page mode is off.

## Coming from Create React App

The React team deprecated Create React App in February 2025 and recommends a framework or Vite for new apps. A CRA project still deploys: `npx lobsite` finds `build/`, and skips `public/`, which CRA copies into the build. Moving to Vite changes a few things on the hosting side:

- the build folder becomes `dist/`, which is found the same way;
- `REACT_APP_` environment variables become `VITE_` ones, read with `import.meta.env`;
- `index.html` moves from `public/` to the project's top folder.

If the app needs server rendering, look at [Next.js](https://lobsite.com/hosting/nextjs) with a static export instead, or a host that runs React on a server.

## React hosts compared

| | Lobsite | Netlify | Vercel | GitHub Pages |
|---|---|---|---|---|
| React Router deep links | `spa = true`, or a switch in the dashboard | A `_redirects` rule | A rewrite in `vercel.json` | No: `HashRouter`, or `404.html` served with status 404 |
| Missing script files after a deploy | 404, a clear error | The app's `index.html` | The app's `index.html` | 404 |
| Server rendering | No | Yes, with a framework | Yes, with a framework | No |
| Account before the first deploy | No: live 6 hours, then keep it free | Yes | Yes | Yes, and a repository |
| Forms without a backend | Yes, once the site is in an account | Yes | No | No |
| Custom domain | Yes, free | Yes | Yes | Yes |

For a React app that runs in the browser, which is what Vite builds, Lobsite deploys it with one command, uploads only the chunks that changed, and keeps a preview URL for every deploy.

## Frequently asked questions

### Why does refreshing a React Router page show "Not found"?

The address only exists inside the app, so the server has no file for it. Turn on single-page mode with `spa = true` in `lobsite.toml`, or **Single-page app** in the site's settings.

### Can I host a Create React App project here?

Yes. Run `npm run build` and `npx lobsite`; the `build/` folder is found and deployed. Turn on single-page mode if it uses React Router with browser routes.

### Can a React form send submissions without a backend?

Yes, if the form is in the built HTML, for example in `index.html`, and posts to `/_lobsite/forms/contact`. A form that only React draws isn't found at deploy time, and its submissions are refused. The [forms docs](https://lobsite.com/docs/forms#frameworks) explain how to keep the form in the HTML and send it with `fetch()`.

### Do I need Next.js to host a React app?

No. A React app built with Vite is plain files and runs on any static host. Next.js is for server rendering or prerendered pages, and has a [static export](https://lobsite.com/hosting/nextjs) of its own.