> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/zhcndoc/bun/llms.txt
> Use this file to discover all available pages before exploring further.
# Use React and JSX
> How to use React with Bun
Bun has native support for React and JSX, making it easy to build React applications without any build configuration.
## Quick Start
```bash theme={null}
mkdir my-react-app
cd my-react-app
bun init -y
```
```bash theme={null}
bun add react react-dom
bun add -d @types/react @types/react-dom
```
```tsx app.tsx theme={null}
import React from "react";
export function App() {
return (
Hello from React + Bun!
);
}
```
```tsx server.tsx theme={null}
import { renderToString } from "react-dom/server";
import { App } from "./app";
Bun.serve({
port: 3000,
fetch() {
const html = renderToString();
return new Response(
`
React + Bun
${html}
`,
{ headers: { "Content-Type": "text/html" } }
);
},
});
console.log("Server running at http://localhost:3000");
```
```bash theme={null}
bun run server.tsx
```
## JSX Configuration
Bun automatically transforms JSX. Configure it in `tsconfig.json`:
```json tsconfig.json theme={null}
{
"compilerOptions": {
"jsx": "react-jsx",
"jsxImportSource": "react"
}
}
```
## Next Steps
Build full-stack React apps with Next.js
Learn about JSX support in Bun