remix-run · brookslybrand · Sep 24, 2025 · Sep 15, 2025 · Sep 15, 2025 · Sep 18, 2025
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
@@ -9,5 +9,6 @@ packages:
   - "node-custom-server"
   - "node-postgres"
   - "vercel"
-  - "unstable_rsc-parcel"
-  - "unstable_rsc-vite"
+  - "unstable_rsc-data-mode-parcel"
+  - "unstable_rsc-data-mode-vite"
+  - "unstable_rsc-framework-mode"
diff --git a/unstable_rsc-parcel/.gitignore → unstable_rsc-data-mode-parcel/.gitignore b/unstable_rsc-parcel/.gitignore → unstable_rsc-data-mode-parcel/.gitignore
diff --git a/unstable_rsc-parcel/README.md → unstable_rsc-data-mode-parcel/README.md b/unstable_rsc-parcel/README.md → unstable_rsc-data-mode-parcel/README.md
diff --git a/unstable_rsc-parcel/package.json → unstable_rsc-data-mode-parcel/package.json b/unstable_rsc-parcel/package.json → unstable_rsc-data-mode-parcel/package.json
@@ -32,7 +32,7 @@
     "express": "^5.1.0",
     "react": "19.1.0",
     "react-dom": "19.1.0",
-    "react-router": "7.7.0",
+    "react-router": "7.9.2",
     "react-server-dom-parcel": "19.1.0"
   },
   "devDependencies": {

diff --git a/unstable_rsc-parcel/public/favicon.ico → ...e_rsc-data-mode-parcel/public/favicon.ico b/unstable_rsc-parcel/public/favicon.ico → ...e_rsc-data-mode-parcel/public/favicon.ico
diff --git a/unstable_rsc-parcel/src/entry.browser.tsx → ...sc-data-mode-parcel/src/entry.browser.tsx b/unstable_rsc-parcel/src/entry.browser.tsx → ...sc-data-mode-parcel/src/entry.browser.tsx
diff --git a/unstable_rsc-parcel/src/entry.rsc.tsx → ...le_rsc-data-mode-parcel/src/entry.rsc.tsx b/unstable_rsc-parcel/src/entry.rsc.tsx → ...le_rsc-data-mode-parcel/src/entry.rsc.tsx
diff --git a/unstable_rsc-parcel/src/entry.ssr.tsx → ...le_rsc-data-mode-parcel/src/entry.ssr.tsx b/unstable_rsc-parcel/src/entry.ssr.tsx → ...le_rsc-data-mode-parcel/src/entry.ssr.tsx
diff --git a/...ble_rsc-parcel/src/routes/about/route.tsx → ...ta-mode-parcel/src/routes/about/route.tsx b/...ble_rsc-parcel/src/routes/about/route.tsx → ...ta-mode-parcel/src/routes/about/route.tsx
diff --git a/unstable_rsc-parcel/src/routes/config.ts → ...rsc-data-mode-parcel/src/routes/config.ts b/unstable_rsc-parcel/src/routes/config.ts → ...rsc-data-mode-parcel/src/routes/config.ts
diff --git a/...able_rsc-parcel/src/routes/home/route.tsx → ...ata-mode-parcel/src/routes/home/route.tsx b/...able_rsc-parcel/src/routes/home/route.tsx → ...ata-mode-parcel/src/routes/home/route.tsx
diff --git a/...ble_rsc-parcel/src/routes/root/client.tsx → ...ta-mode-parcel/src/routes/root/client.tsx b/...ble_rsc-parcel/src/routes/root/client.tsx → ...ta-mode-parcel/src/routes/root/client.tsx
diff --git a/...able_rsc-parcel/src/routes/root/route.tsx → ...ata-mode-parcel/src/routes/root/route.tsx b/...able_rsc-parcel/src/routes/root/route.tsx → ...ata-mode-parcel/src/routes/root/route.tsx
diff --git a/...ble_rsc-parcel/src/routes/root/styles.css → ...ta-mode-parcel/src/routes/root/styles.css b/...ble_rsc-parcel/src/routes/root/styles.css → ...ta-mode-parcel/src/routes/root/styles.css
diff --git a/unstable_rsc-parcel/tsconfig.json → unstable_rsc-data-mode-parcel/tsconfig.json b/unstable_rsc-parcel/tsconfig.json → unstable_rsc-data-mode-parcel/tsconfig.json
diff --git a/unstable_rsc-vite/.gitignore → unstable_rsc-data-mode-vite/.gitignore b/unstable_rsc-vite/.gitignore → unstable_rsc-data-mode-vite/.gitignore
diff --git a/unstable_rsc-vite/README.md → unstable_rsc-data-mode-vite/README.md b/unstable_rsc-vite/README.md → unstable_rsc-data-mode-vite/README.md
diff --git a/unstable_rsc-vite/package.json → unstable_rsc-data-mode-vite/package.json b/unstable_rsc-vite/package.json → unstable_rsc-data-mode-vite/package.json
@@ -14,7 +14,7 @@
     "express": "^5.1.0",
     "react": "19.1.0",
     "react-dom": "19.1.0",
-    "react-router": "7.7.0"
+    "react-router": "7.9.2"
   },
   "devDependencies": {
     "@tailwindcss/typography": "0.5.16",

diff --git a/unstable_rsc-vite/public/favicon.ico → ...ble_rsc-data-mode-vite/public/favicon.ico b/unstable_rsc-vite/public/favicon.ico → ...ble_rsc-data-mode-vite/public/favicon.ico
diff --git a/unstable_rsc-vite/server.js → unstable_rsc-data-mode-vite/server.js b/unstable_rsc-vite/server.js → unstable_rsc-data-mode-vite/server.js
diff --git a/unstable_rsc-vite/src/entry.browser.tsx → ..._rsc-data-mode-vite/src/entry.browser.tsx b/unstable_rsc-vite/src/entry.browser.tsx → ..._rsc-data-mode-vite/src/entry.browser.tsx
diff --git a/unstable_rsc-vite/src/entry.rsc.tsx → ...able_rsc-data-mode-vite/src/entry.rsc.tsx b/unstable_rsc-vite/src/entry.rsc.tsx → ...able_rsc-data-mode-vite/src/entry.rsc.tsx
diff --git a/unstable_rsc-vite/src/entry.ssr.tsx → ...able_rsc-data-mode-vite/src/entry.ssr.tsx b/unstable_rsc-vite/src/entry.ssr.tsx → ...able_rsc-data-mode-vite/src/entry.ssr.tsx
diff --git a/unstable_rsc-vite/src/routes/about/route.tsx → ...data-mode-vite/src/routes/about/route.tsx b/unstable_rsc-vite/src/routes/about/route.tsx → ...data-mode-vite/src/routes/about/route.tsx
diff --git a/unstable_rsc-vite/src/routes/config.ts → ...e_rsc-data-mode-vite/src/routes/config.ts b/unstable_rsc-vite/src/routes/config.ts → ...e_rsc-data-mode-vite/src/routes/config.ts
diff --git a/unstable_rsc-vite/src/routes/home/route.tsx → ...-data-mode-vite/src/routes/home/route.tsx b/unstable_rsc-vite/src/routes/home/route.tsx → ...-data-mode-vite/src/routes/home/route.tsx
diff --git a/unstable_rsc-vite/src/routes/root/client.tsx → ...data-mode-vite/src/routes/root/client.tsx b/unstable_rsc-vite/src/routes/root/client.tsx → ...data-mode-vite/src/routes/root/client.tsx
diff --git a/unstable_rsc-vite/src/routes/root/route.tsx → ...-data-mode-vite/src/routes/root/route.tsx b/unstable_rsc-vite/src/routes/root/route.tsx → ...-data-mode-vite/src/routes/root/route.tsx
diff --git a/unstable_rsc-vite/src/routes/root/styles.css → ...data-mode-vite/src/routes/root/styles.css b/unstable_rsc-vite/src/routes/root/styles.css → ...data-mode-vite/src/routes/root/styles.css
diff --git a/unstable_rsc-vite/tsconfig.json → unstable_rsc-data-mode-vite/tsconfig.json b/unstable_rsc-vite/tsconfig.json → unstable_rsc-data-mode-vite/tsconfig.json
diff --git a/unstable_rsc-vite/vite.config.ts → unstable_rsc-data-mode-vite/vite.config.ts b/unstable_rsc-vite/vite.config.ts → unstable_rsc-data-mode-vite/vite.config.ts
diff --git a/unstable_rsc-framework-mode/.gitignore b/unstable_rsc-framework-mode/.gitignore
@@ -0,0 +1,6 @@
+.DS_Store
+/node_modules/
+
+# React Router
+/.react-router/
+/build/
diff --git a/unstable_rsc-framework-mode/README.md b/unstable_rsc-framework-mode/README.md
@@ -0,0 +1,65 @@
+# Welcome to React Router! (Experimental RSC)
+
+⚠️ **EXPERIMENTAL**: This template demonstrates React Server Components with React Router. This is experimental technology and not recommended for production use.
+
+A modern template for exploring React Server Components (RSC) with React Router, powered by Vite.
+
+## Features
+
+- 🧪 **Experimental React Server Components**
+- 🚀 Server-side rendering with RSC
+- ⚡️ Hot Module Replacement (HMR)
+- 📦 Asset bundling and optimization with Vite
+- 🔄 Data loading and mutations
+- 🔒 TypeScript by default
+- 🎉 TailwindCSS for styling
+- 📖 [React Router docs](https://reactrouter.com/)
+- 📚 [React Server Components guide](https://reactrouter.com/how-to/react-server-components)
+
+## Getting Started
+
+### Installation
+
+Install the dependencies:
+
+```bash
+npm install
+```
+
+### Development
+
+Start the development server with HMR:
+
+```bash
+npm run dev
+```
+
+Your application will be available at `http://localhost:5173`.
+
+## Building for Production
+
+Create a production build:
+
+```bash
+npm run build
+```
+
+## Running Production Build
+
+Run the production server:
+
+```bash
+npm start
+```
+
+## Understanding React Server Components
+
+Learn more about React Server Components with React Router in our [comprehensive guide](https://reactrouter.com/how-to/react-server-components).
+
+## Styling
+
+This template comes with [Tailwind CSS](https://tailwindcss.com/) already configured for a simple default starting experience. You can use whatever CSS framework you prefer.
+
+---
+
+Built with ❤️ using React Router. 
diff --git a/unstable_rsc-framework-mode/app/app.css b/unstable_rsc-framework-mode/app/app.css
@@ -0,0 +1,15 @@
+@import "tailwindcss";
+
+@theme {
+  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+
+html,
+body {
+  @apply bg-white dark:bg-gray-950;
+
+  @media (prefers-color-scheme: dark) {
+    color-scheme: dark;
+  }
+}
diff --git a/unstable_rsc-framework-mode/app/root.tsx b/unstable_rsc-framework-mode/app/root.tsx
@@ -0,0 +1,73 @@
+import {
+  isRouteErrorResponse,
+  Links,
+  Meta,
+  Outlet,
+  ScrollRestoration,
+} from "react-router";
+
+import type { Route } from "./+types/root";
+import "./app.css";
+
+export const links: Route.LinksFunction = () => [
+  { rel: "preconnect", href: "https://fonts.googleapis.com" },
+  {
+    rel: "preconnect",
+    href: "https://fonts.gstatic.com",
+    crossOrigin: "anonymous",
+  },
+  {
+    rel: "stylesheet",
+    href: "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap",
+  },
+];
+
+export function Layout({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en">
+      <head>
+        <meta charSet="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <Meta />
+        <Links />
+      </head>
+      <body>
+        {children}
+        <ScrollRestoration />
+      </body>
+    </html>
+  );
+}
+
+export default function App() {
+  return <Outlet />;
+}
+
+export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
+  let message = "Oops!";
+  let details = "An unexpected error occurred.";
+  let stack: string | undefined;
+
+  if (isRouteErrorResponse(error)) {
+    message = error.status === 404 ? "404" : "Error";
+    details =
+      error.status === 404
+        ? "The requested page could not be found."
+        : error.statusText || details;
+  } else if (import.meta.env.DEV && error && error instanceof Error) {
+    details = error.message;
+    stack = error.stack;
+  }
+
+  return (
+    <main className="container p-4 pt-16 mx-auto">
+      <h1>{message}</h1>
+      <p>{details}</p>
+      {stack && (
+        <pre className="overflow-x-auto p-4 w-full">
+          <code>{stack}</code>
+        </pre>
+      )}
+    </main>
+  );
+}
diff --git a/unstable_rsc-framework-mode/app/routes.ts b/unstable_rsc-framework-mode/app/routes.ts
@@ -0,0 +1,3 @@
+import { type RouteConfig, index } from "@react-router/dev/routes";
+
+export default [index("routes/home.tsx")] satisfies RouteConfig;
diff --git a/unstable_rsc-framework-mode/app/routes/home.tsx b/unstable_rsc-framework-mode/app/routes/home.tsx
@@ -0,0 +1,13 @@
+import type { Route } from "./+types/home";
+import { Welcome } from "../welcome/welcome";
+
+export function meta({}: Route.MetaArgs) {
+  return [
+    { title: "New React Router App" },
+    { name: "description", content: "Welcome to React Router!" },
+  ];
+}
+
+export function ServerComponent() {
+  return <Welcome />;
+}
diff --git a/unstable_rsc-framework-mode/app/welcome/logo-dark.svg b/unstable_rsc-framework-mode/app/welcome/logo-dark.svg
diff --git a/unstable_rsc-framework-mode/app/welcome/logo-light.svg b/unstable_rsc-framework-mode/app/welcome/logo-light.svg
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import { type RouteConfig, index } from "@react-router/dev/routes";

		export default [index("routes/home.tsx")] satisfies RouteConfig;