[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_207":208,"_209":210},"routes/_app.x.$handle.$name",{"_117":116,"_34":62,"_126":105,"_29":127,"_13":14,"_128":-5,"_11":129,"_130":131,"_132":133,"_134":135,"_136":137,"_23":-5,"_138":-5,"_139":140,"_141":27,"_142":143,"_144":77,"_145":-5,"_146":-5,"_147":148},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_60":61,"_34":62,"_39":63,"_64":-5,"_65":27,"_66":67,"_68":67,"_69":70,"_71":72,"_18":73,"_74":75,"_76":77,"_78":77,"_79":-5,"_80":81,"_82":83,"_84":-5,"_85":-5,"_86":-5,"_87":-5,"_88":89,"_90":89,"_91":92,"_93":92,"_94":92,"_95":89,"_96":89,"_97":98,"_99":100,"_101":102,"_103":27},"version",1,"changes",[19,20,21,22],"aiChatInfo","userId",{"_23":55,"_25":-7,"_26":27,"_28":27,"_29":56,"_31":56},{"_23":50,"_25":-7,"_26":27,"_28":27,"_29":51,"_31":51},{"_23":44,"_25":-7,"_26":27,"_28":27,"_29":45,"_31":45},{"_23":24,"_25":-7,"_26":27,"_28":27,"_29":30,"_31":30},"file",{"_32":33,"_34":30,"_35":36,"_37":38,"_39":40,"_41":14,"_42":43,"_26":27},"previous","deleted",false,"deletedHere","path","server.tsx","latestPath","fileId","c85ea5c7-1ed9-4e73-8e15-57b47b557cd3","name","fileType","http","content","/** @jsxImportSource https://esm.sh/react@19 */\nimport { Hono } from \"npm:hono@4\";\nimport * as React from \"https://esm.sh/react@19\";\nimport ReactDOMServer from \"https://esm.sh/react-dom@19/server\";\nimport {\n createStaticHandler,\n createStaticRouter,\n StaticRouterProvider,\n} from \"https://esm.sh/react-router\";\nimport routes from \"./routes.tsx\";\n\nconst CLIENT_MODULE = import.meta.resolve(\"./client.tsx\");\n\nconst app = new Hono();\n\n// api server\napp.get(\"/api\", async (c) => {\n return c.json([\n { name: \"Leia\", breed: \"DSH\", coat: \"Calico\" },\n { name: \"Chewie\", breed: \"DSH\", coat: \"Tuxedo\" },\n ]);\n});\n\n// react app\napp.get(\"*\", async (c) => {\n const { query, dataRoutes } = createStaticHandler(routes);\n const context = await query(c.req.raw);\n const router = createStaticRouter(dataRoutes, context);\n \n let html = await ReactDOMServer.renderToReadableStream(\n \n , {\n bootstrapModules: [ CLIENT_MODULE ],\n });\n\n return new Response(html, {\n headers: {\n \"Content-Type\": \"text/html\",\n },\n });\n});\n\nexport default app.fetch;","createdAt",["D",1747405584077],"branchVersion","branchId","beace740-3261-11f0-833f-569c3dd06744",{"_32":46,"_34":45,"_35":47,"_37":48,"_39":49,"_41":14,"_42":43,"_26":27},"routes.tsx","7fe99aa9-ad41-4a7f-bbc1-d35754e97603","script","/** @jsxImportSource https://esm.sh/react@19 */\nimport React from \"https://esm.sh/react@19\";\nimport {\n createBrowserRouter,\n RouterProvider,\n useLoaderData,\n Link,\n Outlet,\n} from \"https://esm.sh/react-router@7\";\n\nconst API_URL = \"/api\";\n\nfunction HTML ({ children }: {\n children: React.ReactNode;\n}) {\n return (\n \n \n React Router Hono Starter\n \n \n {children}\n \n \n )\n}\n\nfunction Layout () {\n return (\n \n

React Router Hono Starter

\n \n

\n \n \n

\n \n );\n}\n\nfunction Home () {\n const [count, setCount] = React.useState(0);\n return (\n

Hello, Home page

{count}

\n \n

\n );\n}\n\nfunction About () {\n const data = useLoaderData();\n \n return (\n

Hello, About page

{JSON.stringify(data, null, 2)}

\n )\n}\n\nasync function catsLoader () {\n const data = await fetch(API_URL)\n .then(res => res.json());\n return data;\n}\n\nexport const routes = [\n {\n Component: Layout,\n children: [\n {\n Component: Home,\n index: true,\n },\n {\n Component: About,\n path: \"about\",\n loader: catsLoader,\n },\n ]\n },\n]\n\nexport default routes;",["D",1747405584077],{"_32":52,"_34":51,"_35":23,"_37":53,"_39":54,"_41":14,"_42":43,"_26":27},"README.md","4c3d8c88-0851-486e-90a8-373588366e35","# React Router Hono Starter\n\nMinimal React Router + Hono starter example in [\"data mode\"][modes] with server-side rendering for Val Town\n\n[View demo][demo]\n\n## How it works\n\nThe `server.tsx` file is the main server that responds with an HTML stream, using React Router, or an API response.\nThe HTML includes a `

Diff · v1