> ## Documentation Index
> Fetch the complete documentation index at: https://bun.manicule.dev/llms.txt
> Use this file to discover all available pages before exploring further.
> For every page in one file, fetch https://bun.manicule.dev/llms-full.txt (large).
> To search and read these docs as tools, connect the MCP server at https://bun.manicule.dev/api/mcp.
> Every agent surface: https://bun.manicule.dev/.well-known/llms-manifest.json

# Build a React app with Bun (/guides/ecosystem/react)

<!-- agent-signals: reading_time_min: 1 · est_tokens: 354 · updated: 2026-08-02 -->
Related: [Build an app with Astro and Bun](/guides/ecosystem/astro.md), [Create a Discord bot](/guides/ecosystem/discordjs.md), [Containerize a Bun application with Docker](/guides/ecosystem/docker.md), [Use Drizzle ORM with Bun](/guides/ecosystem/drizzle.md), [Use Gel with Bun](/guides/ecosystem/gel.md), [Build an HTTP server using Elysia and Bun](/guides/ecosystem/elysia.md)

Bun has built-in support for `.jsx` and `.tsx` files. React works with Bun.

Create a new React app with `bun init --react`. This gives you a template with a React app and an API server together in one full-stack app.

```bash icon="terminal" title="terminal" terminal
# Create a new React app
bun init --react

# Run the app in development mode
bun dev

# Build as a static site for production
bun run build

# Run the server in production
bun start
```

***

### Hot Reloading

Run `bun dev` to start the app in development mode. This starts the API server and the React app with hot reloading.

### Full-Stack App

Run `bun start` to start the API server and frontend together in one process.

### Static Site

Run `bun run build` to build the app as a static site. This creates a `dist` directory with the built app and its assets.

```txt icon="folder-tree" title="File Tree"
├── src/
│   ├── index.ts        # Server entry point with API routes
│   ├── frontend.tsx    # React app entry point with HMR
│   ├── App.tsx         # Main React component
│   ├── APITester.tsx   # Component for testing API endpoints
│   ├── index.html      # HTML template
│   ├── index.css       # Styles
│   └── *.svg           # Static assets
├── package.json        # Dependencies and scripts
├── tsconfig.json       # TypeScript configuration
├── bunfig.toml         # Bun configuration
└── bun.lock            # Lock file
```