A React Framework for Cloudflare.
It begins as a Vite plugin that unlocks SSR, React Server Components, Server Functions, and realtime features.
RedwoodSDK is the missing React framework for Cloudflare — bringing SSR, React Server Components, Server Functions, and Realtime APIs to the edge with the power of Vite.
It features:
- ⚡️ Zero-config Vite integration
- 🔁 Realtime server functions
- 🧠 Smart, composable router with middleware and interruptors
- 🔥 Blazing-fast SSR and RSC support
Start a new project:
npx create-rwsdk my-project-nameInstall dependencies:
cd my-project-name
pnpm installRun the dev server:
pnpm devVITE v6.2.0 ready in 500 ms
➜ Local: http://localhost:5173/
➜ Network: use --host to expose
➜ press h + enter to show helpThat's it, your RedwoodSDK is up and running!
As long as you return a valid Response, RedwoodSDK is happy!
// worker.tsx
import { defineApp } from "rwsdk/worker";
import { route, render } from "rwsdk/router";
import MyReactPage from "@app/pages/MyReactPage";
export default defineApp([
render(Document, [
route("/", () => new Response("Hello, World!")),
route("/ping", function () {
return <h1>Pong!</h1>;
}),
route("/react", MyReactPage)
route("/docs", async () => {
return new Response(null, {
status: 301,
headers: {
"Location": "https://docs.rwsdk.com",
},
});
}),
route("/sitemap.xml", async () => {
return new Response(sitemap, {
status: 200,
headers: {
"Content-Type": "application/xml",
},
});
}),
route("/robots.txt", async () => {
const robotsTxt = `User-agent: *
Allow: /
Disallow: /search
Sitemap: https://rwsdk.com/sitemap.xml`;
return new Response(robotsTxt, {
status: 200,
headers: {
"Content-Type": "text/plain",
},
});
}),
]),
]);Start building immediately → Quick start guide
RedwoodSDK is true Javascript full-stack:
// users.ts (server function)
"use server";
import { db } from "@/db";
export async function getUsers() {
const users = await db.users.findAll();
return users;
}
// UserList.tsx (React server component)
import { getUsers } from "./users";
export default async function UsersPage() {
const users = await getUsers();
return (
<div>
<ul>
{users.map((user) => (
<li key={user.id}>{user.name}</li>
))}
</ul>
</div>
);
}Setup a database now → React Server Components
If this project saves you time or sparks ideas, please ⭐ star the repo — it really helps us grow the community.
This is a monorepo. To contribute or explore packages:
- Fix bugs or propose features
- Join our community on Discord