Val Town React + Hono Starter

\n I've been clicked times\n

\n );\n}",[],[156,173,179],[156,173],{"_105":188,"_96":189,"_157":190,"_159":158,"_160":142,"_161":102,"_162":119,"_107":191,"_101":32,"_164":192,"_166":193,"_167":22,"_168":-5,"_169":194,"_99":195},"7a6e5dc4-ad0a-11f0-9b89-0224a6c84d84","favicon.svg","0199fd59-0f30-74dd-915c-b38c679597e6",["D",1760892096189],"file","\n",[],[156,189],{"_105":197,"_96":198,"_157":199,"_159":158,"_160":142,"_161":102,"_162":22,"_107":200,"_101":32,"_164":192,"_166":201,"_167":22,"_168":-5,"_169":202,"_99":203},"7a6e5f22-ad0a-11f0-9b89-0224a6c84d84","index.html","0199fd59-0f30-74dd-915c-b4130426fc64",["D",1760892096189],"\n\n \n \n \n React Hono Val Town Starter\n \n \n \n \n

\n \n \n \n",[],[156,198],{"_105":205,"_96":206,"_157":207,"_159":158,"_160":142,"_161":102,"_162":119,"_107":208,"_101":32,"_164":182,"_166":209,"_167":22,"_168":-5,"_169":210,"_99":211},"7a6e6134-ad0a-11f0-9b89-0224a6c84d84","index.tsx","0199fd59-0f30-74dd-915c-b8cebf21b0e3",["D",1760892096189],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();",[],[156,206],{"_105":213,"_96":214,"_157":215,"_159":158,"_160":142,"_161":102,"_162":22,"_107":216,"_101":32,"_164":192,"_166":217,"_167":22,"_168":-5,"_169":218,"_99":219},"7a6e624c-ad0a-11f0-9b89-0224a6c84d84","style.css","0199fd59-0f30-74dd-915c-be3e7bf6e924",["D",1760892096189],"body {\n font-family: -apple-system, Arial, sans-serif;\n color: #333;\n padding: 20px;\n}\n\nbutton {\n background-color: #4a90e2;\n color: white;\n border: none;\n padding: 8px 16px;\n border-radius: 4px;\n cursor: pointer;\n}\n\nbutton:hover {\n background-color: #357ae8;\n}",[],[156,214],[156],{"_105":222,"_96":223,"_157":224,"_159":-5,"_160":142,"_161":102,"_162":119,"_107":225,"_101":32,"_164":192,"_166":226,"_167":22,"_168":-5,"_169":227,"_99":228},"7a6e64ae-ad0a-11f0-9b89-0224a6c84d84","README.md","0199fd59-0f30-74dd-915c-c5d814624047",["D",1760892096189],"# React Hono Starter\n\nThis app is a starter template for client-side React and server-side Hono.\n\n## Getting started\n\nGet a copy of this starter template by clicking the **Remix** button in the\ntop-right.\n\n## How it works\n\n- The **entrypoint** is [`index.ts`](index.ts). That's the backend HTTP server,\n which also serves the all the frontend assets.\n\n- The **client-side entrypoint** is\n [`/frontend/index.html`](/frontend/index.html)\n - which in turn imports [`/frontend/index.tsx`](/frontend/index.tsx)\n - which in turn imports the React app from\n [`/frontend/components/App.tsx`](/frontend/components/App.tsx).\n\nSo if you wanted to get a sense of how this app comes together, we suggest\nreading the files in this order:\n\n[`index.ts`](index.ts) -> [`/frontend/index.html`](/frontend/index.html) ->\n[`/frontend/index.tsx`](/frontend/index.tsx) ->\n[`/frontend/components/App.tsx`](/frontend/components/App.tsx)\n\n## Further resources\n\n- [React Hono Example](https://www.val.town/x/stevekrouse/reactHonoExample) is a\n bigger example project, with a SQLite database table, queries, client-side\n CSS, a favicon, and shared code that runs on both client and server.",[],[223],{"_105":230,"_96":100,"_157":117,"_159":-5,"_160":142,"_161":102,"_162":119,"_107":231,"_101":32,"_164":232,"_166":233,"_167":22,"_168":234,"_169":235,"_99":236},"7a6e677e-ad0a-11f0-9b89-0224a6c84d84",["D",1760892096189],"http","import { serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\n\nconst app = new Hono();\n\n// Serve index.html at the root /\napp.get(\"/\", () => serveFile(\"/frontend/index.html\"));\n\n// Serve all /frontend files\napp.get(\"/frontend/**/*\", (c) => serveFile(c.req.path));\n\n// Add your API routes here\n// app.get(\"/api/data\", c => c.json({ hello: \"world\" }));\n\n// Unwrap and rethrow Hono errors as the original error\n// If you delete this, all errors will be \"Internal Server Error\"\napp.onError((err) => Promise.reject(err));\n\n// HTTP vals expect an exported \"fetch handler\"\n// This is how you \"run the server\" in Val Town with Hono\nexport default app.fetch;","webmedia",[],[100],"files",[154,171,177,187,196,204,212,221,229],"counts",{"_241":32,"_242":102,"_243":32,"_244":245,"_248":249},"pulls","branches","forks","envVars",{"_246":32,"_247":32},"count","emptyCount","connections",{"_246":32,"_250":32},"unfilledCount","contents",[],{"_105":230,"_96":100,"_157":117,"_159":-5,"_160":142,"_161":102,"_162":119,"_107":254,"_101":32,"_164":232,"_166":233,"_167":22,"_168":234,"_99":255},["D",1760892096189],[100],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_94":95,"_96":97,"_98":44,"_101":102,"_99":100,"_103":264,"_152":269,"_237":297,"_192":298,"_251":301,"_302":-5,"_303":-5,"_304":-5,"_305":-5,"_306":307,"_244":-5},{"_105":106,"_96":97,"_107":265,"_109":-5,"_110":22,"_111":112,"_113":-5,"_114":-5,"_14":115,"_116":117,"_118":119,"_120":119,"_121":-5,"_122":32,"_16":123,"_124":125,"_126":125,"_127":128,"_129":128,"_130":128,"_131":125,"_132":125,"_23":266,"_136":267,"_139":268,"_151":22},["D",1760892096189],{"_94":95,"_134":135},{"_94":95,"_138":135,"_14":115},{"_101":141,"_96":44,"_105":142,"_143":106,"_144":-5,"_145":-5,"_146":-5,"_147":-5,"_148":-5,"_149":97,"_150":95},[270,291,294],{"_105":155,"_96":156,"_157":158,"_159":-5,"_160":142,"_161":102,"_162":119,"_107":163,"_101":32,"_164":165,"_166":-5,"_167":22,"_168":-5,"_169":271,"_99":290},[272,278,281,284,287],{"_105":172,"_96":173,"_157":174,"_159":158,"_160":142,"_161":102,"_162":119,"_107":175,"_101":32,"_164":165,"_166":-5,"_167":22,"_168":-5,"_169":273,"_99":277},[274],{"_105":178,"_96":179,"_157":180,"_159":174,"_160":142,"_161":102,"_162":119,"_107":181,"_101":32,"_164":182,"_166":183,"_167":22,"_168":-5,"_169":275,"_99":276},[],[156,173,179],[156,173],{"_105":188,"_96":189,"_157":190,"_159":158,"_160":142,"_161":102,"_162":119,"_107":191,"_101":32,"_164":192,"_166":193,"_167":22,"_168":-5,"_169":279,"_99":280},[],[156,189],{"_105":197,"_96":198,"_157":199,"_159":158,"_160":142,"_161":102,"_162":22,"_107":200,"_101":32,"_164":192,"_166":201,"_167":22,"_168":-5,"_169":282,"_99":283},[],[156,198],{"_105":205,"_96":206,"_157":207,"_159":158,"_160":142,"_161":102,"_162":119,"_107":208,"_101":32,"_164":182,"_166":209,"_167":22,"_168":-5,"_169":285,"_99":286},[],[156,206],{"_105":213,"_96":214,"_157":215,"_159":158,"_160":142,"_161":102,"_162":22,"_107":216,"_101":32,"_164":192,"_166":217,"_167":22,"_168":-5,"_169":288,"_99":289},[],[156,214],[156],{"_105":222,"_96":223,"_157":224,"_159":-5,"_160":142,"_161":102,"_162":119,"_107":225,"_101":32,"_164":192,"_166":226,"_167":22,"_168":-5,"_169":292,"_99":293},[],[223],{"_105":230,"_96":100,"_157":117,"_159":-5,"_160":142,"_161":102,"_162":119,"_107":231,"_101":32,"_164":232,"_166":233,"_167":22,"_168":234,"_169":295,"_99":296},[],[100],[270,272,274,278,281,284,287,291,294],{"_105":230,"_160":142,"_157":117,"_96":100,"_166":233,"_164":232,"_101":32,"_159":-5,"_107":299,"_161":102,"_168":234,"_99":300},["D",1760892096189],[100],[],"upstream","pull","ahead","behind","templates",[],"actionData","errors"]

handler

untitled-190