# Bun Server-side render (SSR) a React component
> Server-side render (SSR) a React component
- Skill: `jarle/bun-server-side-render-ssr-a-react-component` (Agent Skill)
- Install (CLI): `npx skillmds@latest add jarle/bun-server-side-render-ssr-a-react-component`
- Raw SKILL.md: https://api.skillmd.com/api/skills/jarle/bun-server-side-render-ssr-a-react-component/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: jarle (https://skillmd.com/u/jarle)
- Updated: 2026-09-10
- Page: https://skillmd.com/skills/jarle/bun-server-side-render-ssr-a-react-component
---
# Server-side render (SSR) a React component
To get started, install `react` & `react-dom`:
```sh terminal icon="terminal" theme={"theme":{"light":"github-light","dark":"dracula"}}
# 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" theme={"theme":{"light":"github-light","dark":"dracula"}}
import { renderToReadableStream } from "react-dom/server";
function Component(props: { message: string }) {
return (
{props.message}
);
}
const stream = await renderToReadableStream();
```
***
Combining this with `Bun.serve()`, we get a simple SSR HTTP server:
```tsx server.ts icon="https://mintcdn.com/bun-1dd33a4e/nIz6GtMH5K-dfXeV/icons/typescript.svg?fit=max&auto=format&n=nIz6GtMH5K-dfXeV&q=85&s=5d73d76daf7eb7b158469d8c30d349b0" theme={"theme":{"light":"github-light","dark":"dracula"}}
Bun.serve({
async fetch() {
const stream = await renderToReadableStream();
return new Response(stream, {
headers: { "Content-Type": "text/html" },
});
},
});
```
***
React `19` and later includes 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`, please make sure to install version `19` of `react` & `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 more information.