# Server-side render (SSR) a React component (/docs/guides/ecosystem/ssr-react)
Related: [Build an app with Astro and Bun](/docs/guides/ecosystem/astro.md), [Create a Discord bot](/docs/guides/ecosystem/discordjs.md), [Containerize a Bun application with Docker](/docs/guides/ecosystem/docker.md), [Use Drizzle ORM with Bun](/docs/guides/ecosystem/drizzle.md), [Use Gel with Bun](/docs/guides/ecosystem/gel.md), [Build an HTTP server using Elysia and Bun](/docs/guides/ecosystem/elysia.md)
Install `react` and `react-dom`:
```sh terminal icon="terminal"
# Any package manager can be used
bun add react react-dom
```
***
To render a React component to an HTML stream server-side (SSR):
```tsx ssr-react.tsx icon="file-code"
import { renderToReadableStream } from "react-dom/server";
function Component(props: { message: string }) {
return (
{props.message}
);
}
const stream = await renderToReadableStream();
```
***
Combine this with `Bun.serve()` to get an SSR HTTP server:
```tsx server.tsx icon="/icons/typescript.svg"
Bun.serve({
async fetch() {
const stream = await renderToReadableStream();
return new Response(stream, {
headers: { "Content-Type": "text/html" },
});
},
});
```
***
React `19` and later include an [SSR optimization](https://github.com/facebook/react/pull/25597) that takes advantage of Bun's "direct" `ReadableStream` implementation. If you run into an error like `export named 'renderToReadableStream' not found`, install version `19` of `react` and `react-dom`, or import from `react-dom/server.browser` instead of `react-dom/server`. See [facebook/react#28941](https://github.com/facebook/react/issues/28941) for details.