[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_270":271,"_272":273},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_71":146,"_40":-7,"_147":-5,"_17":148,"_149":150,"_151":152,"_153":154,"_155":156,"_157":-5,"_158":159,"_160":161,"_162":48,"_163":164,"_165":26,"_166":-5,"_167":-5,"_168":169},"routes/_app.x.$handle.$name.compare.$branch",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":22,"_23":24,"_25":26,"_27":28,"_29":30,"_31":-5},"handle","wolf","name","ReactHonoStarterTests","branchName","main","project",{"_32":59,"_13":14,"_34":106,"_46":-5,"_107":48,"_49":50,"_108":50,"_109":-5,"_110":-5,"_111":112,"_113":114,"_115":26,"_116":26,"_117":-5,"_118":119,"_53":120,"_121":-5,"_122":-5,"_123":-5,"_124":-5,"_125":126,"_127":126,"_128":129,"_130":129,"_131":129,"_132":126,"_133":126,"_134":135,"_136":137,"_138":28,"_47":48},"ahead",4,"behind",24,"diff",{"_64":65,"_66":67,"_68":69},"hasChanges",true,"sourceBranch",{"_40":57,"_13":16,"_32":58,"_38":59,"_42":33,"_43":60,"_61":50,"_62":39,"_63":54,"_55":14,"_51":12},"targetBranch",{"_32":33,"_34":35,"_36":37,"_13":16,"_38":39,"_40":41,"_42":-5,"_43":-5,"_44":45,"_46":-5,"_47":48,"_49":50,"_51":52,"_53":54,"_55":56},"pull","id","961078ea-f528-11ef-aa68-569c3dd06744","createdAt",["D",1740674013689],"updatedAt",["D",1785420707976],"projectId","96102714-f528-11ef-aa68-569c3dd06744","version",91,"forkedBranchId","forkedBranchVersion","lockfileKey","1785420708123-esm.town_v_templates_react-hono-starter@91-main","deletedAt","isOwned",false,"privacy","public","userHandle","templates","orgId","019aa807-52c2-709c-928b-2029bae9a558","projectName","react-hono-starter",5,"1afa9c18-418f-11f0-9ddb-76b3cceeab13","1af82212-418f-11f0-9ddb-76b3cceeab13",67,"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","added",[],"deleted",[],"modified",[70],{"_71":72,"_73":74,"_75":76},"path","frontend/components/App.tsx","targetFile",{"_32":98,"_13":78,"_79":99,"_81":100,"_83":33,"_84":101,"_85":48,"_34":102,"_40":20,"_87":88,"_89":103,"_66":48,"_91":-5,"_92":-7,"_71":104,"_94":105},"sourceFile",{"_32":77,"_13":78,"_79":80,"_81":82,"_83":58,"_84":57,"_85":26,"_34":86,"_40":20,"_87":88,"_89":90,"_66":48,"_91":-5,"_92":-7,"_71":93,"_94":95},"be7372f4-4192-11f0-9c9f-76b3cceeab13","App.tsx","fileId","1d416a4e-64ee-4892-9c4d-689cbd8f60cc","parentId","bc12536e-2eb5-4557-b1a1-15f4d5466550","branchId","branchVersion","latest",["D",1749075896466],"fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function App() {\n const [clicked, setClicked] = useState(0);\n return (\n

Val Town React + Hono Starter

\n I've been clicked{\" \"}\n times\n

\n );\n}","label","children",[96,97,78],"contentHash","1d96c6312bb14ace08c3ca9b44a0274aa50bb3600af8b312bd280209a922e7a2","frontend","components","5cb7a1f2-f53e-11ef-937e-569c3dd06744","6e585892-f52b-11ef-a8e1-569c3dd06744","69ed66bc-f52b-11ef-9dac-569c3dd06744",27,["D",1740683366401],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function App() {\n const [clicked, setClicked] = useState(0);\n return (\n

Val Town React + Hono Starter

\n I've been clicked times\n

\n );\n}",[96,97,78],"572f45a0f0ec99935ff566c31d3bbf761edf962e408c2e2fb6df62cbb636a5c4",["D",1749074333680],"legacyEnvVars","httpPrivacy","description","imageUrl","userId","4555dd0e-707e-4444-acd3-049d206eb1db","pinnedFileId","25b2280e-6c32-45a4-837d-86baa70e038b","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"bced381e-9ab2-4b55-929d-e7c5064f7f38","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_145":141},"org",{"_11":12,"_139":-5,"_140":141,"_111":112,"_142":143,"_144":48},"branch","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJvVXpPVUZRTjZGTGd2Q2t4c0RRdFpNZWJ5UCJ9","tier","pro","canRestrictVals","profileImageUrl","","adoptOrgId",{"_32":59,"_13":14,"_34":266,"_46":-5,"_107":48,"_49":50,"_108":50,"_109":-5,"_110":-5,"_111":112,"_113":114,"_115":26,"_116":26,"_117":-5,"_118":119,"_53":120,"_121":-5,"_122":-5,"_123":-5,"_124":-5,"_125":126,"_127":126,"_128":129,"_130":129,"_131":129,"_132":126,"_133":126,"_134":267,"_136":268,"_138":269,"_47":48},"tree",[206,208,215],"files",[206,207,208,209,210,211,212,213,214,215],"counts",{"_196":119,"_197":182,"_198":119,"_199":200,"_201":202},"contents",[176,177,178],"file","upstreamProject",{"_32":39,"_13":56,"_109":172,"_110":173,"_49":50,"_134":174},"upstreamBranch",{"_32":33,"_34":170,"_36":171,"_13":16,"_38":39,"_40":41,"_42":-5,"_43":-5,"_44":45,"_46":-5,"_47":48,"_49":50,"_51":52,"_53":54,"_55":56},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1740674013689],["D",1785420707976],"Starter template with client-side React & Hono server","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/64dc00cc-94d9-47dd-81b1-dde02610d900/square512?exp=1789556399&sig=39cf692678889e4858e1d3f239cccdbb768d0b4bdeeecb6f122e7581a8e69c0b",{"_11":52,"_145":175},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789556399&sig=d4d039bf60786a03d56ec8a29ec1b19630253aab318e490fcd07a6f24846b070",{"_32":191,"_13":192,"_79":193,"_81":-5,"_83":58,"_84":182,"_85":26,"_34":194,"_40":119,"_87":189,"_89":-5,"_66":48,"_91":-5,"_71":195},{"_32":186,"_13":96,"_79":187,"_81":-5,"_83":58,"_84":182,"_85":26,"_34":188,"_40":119,"_87":189,"_89":-5,"_66":48,"_91":-5,"_71":190},{"_32":179,"_13":180,"_79":181,"_81":-5,"_83":58,"_84":182,"_85":26,"_34":183,"_40":119,"_87":157,"_89":184,"_66":48,"_91":-5,"_71":185},"1afd3d56-418f-11f0-9ddb-76b3cceeab13","README.md","fdeba7d4-9c3d-4211-a8a7-4c8675ed8d8f",1,["D",1749074333680],"# 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 top-right.\n\n## How it works\n\n- The **entrypoint** is [`/backend/index.ts`](/backend/index.ts). That's the backend HTTP server, which also serves the all the frontend assets.\n\n- The **client-side entrypoint** is [`/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 [`/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 reading the files in this order: \n\n[`/backend/index.ts`](/backend/index.ts) -> [`/frontend/index.html`](/frontend/index.html) -> [`/frontend/index.tsx`](/frontend/index.tsx) -> [`/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 bigger example project, with a SQLite database table, queries, client-side CSS, a favicon, and shared code that runs on both client and server.",[180],"1afd3b08-418f-11f0-9ddb-76b3cceeab13","1a95b63e-24be-45e4-8439-814734c6305c",["D",1749074333680],"directory",[96],"1afd1ef2-418f-11f0-9ddb-76b3cceeab13","backend","e91605f6-cced-4c3a-9d59-466f1533c787",["D",1749074333680],[192],"pulls","branches","forks","envVars",{"_203":119,"_205":119},"connections",{"_203":119,"_204":119},"count","unfilledCount","emptyCount",{"_32":191,"_13":192,"_79":193,"_81":-5,"_83":58,"_84":182,"_85":26,"_34":263,"_40":119,"_87":189,"_89":-5,"_66":48,"_91":-5,"_92":264,"_71":265},{"_32":256,"_13":257,"_79":114,"_81":193,"_83":58,"_84":182,"_85":26,"_34":258,"_40":119,"_87":259,"_89":260,"_66":48,"_91":-5,"_92":261,"_71":262},{"_32":186,"_13":96,"_79":187,"_81":-5,"_83":58,"_84":182,"_85":26,"_34":253,"_40":119,"_87":189,"_89":-5,"_66":48,"_91":-5,"_92":254,"_71":255},{"_32":249,"_13":97,"_79":82,"_81":187,"_83":58,"_84":182,"_85":26,"_34":250,"_40":119,"_87":189,"_89":-5,"_66":48,"_91":-5,"_92":251,"_71":252},{"_32":77,"_13":78,"_79":80,"_81":82,"_83":58,"_84":57,"_85":26,"_34":86,"_40":20,"_87":88,"_89":90,"_66":48,"_91":-5,"_92":247,"_71":248},{"_32":240,"_13":241,"_79":242,"_81":187,"_83":58,"_84":182,"_85":26,"_34":243,"_40":119,"_87":157,"_89":244,"_66":48,"_91":-5,"_92":245,"_71":246},{"_32":233,"_13":234,"_79":235,"_81":187,"_83":58,"_84":182,"_85":26,"_34":236,"_40":119,"_87":157,"_89":237,"_66":48,"_91":-5,"_92":238,"_71":239},{"_32":226,"_13":227,"_79":228,"_81":187,"_83":58,"_84":182,"_85":26,"_34":229,"_40":119,"_87":88,"_89":230,"_66":48,"_91":-5,"_92":231,"_71":232},{"_32":219,"_13":220,"_79":221,"_81":187,"_83":58,"_84":182,"_85":26,"_34":222,"_40":119,"_87":157,"_89":223,"_66":48,"_91":-5,"_92":224,"_71":225},{"_32":179,"_13":180,"_79":181,"_81":-5,"_83":58,"_84":182,"_85":26,"_34":216,"_40":119,"_87":157,"_89":184,"_66":48,"_91":-5,"_92":217,"_71":218},["D",1749074333680],[],[180],"1afd377a-418f-11f0-9ddb-76b3cceeab13","style.css","c37a000f-9552-44c7-90d4-fabdbe98da19",["D",1749074333680],"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}",[],[96,220],"1afd34dc-418f-11f0-9ddb-76b3cceeab13","index.tsx","6ff0f341-9c99-4f3d-8188-80ac04115e68",["D",1749074333680],"/** @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();",[],[96,227],"1afd3086-418f-11f0-9ddb-76b3cceeab13","index.html","5394d6eb-52e7-42f8-b7b3-71e0672d4829",["D",1749074333680],"\n\n \n \n \n React Hono Val Town Starter\n \n \n \n \n

\n \n \n \n",[],[96,234],"1afd2bc2-418f-11f0-9ddb-76b3cceeab13","favicon.svg","3ba74a7b-632f-41cb-b054-de585b9f071f",["D",1749074333680],"\n",[],[96,241],[],[96,97,78],"1afd255a-418f-11f0-9ddb-76b3cceeab13",["D",1749074333680],[210],[96,97],["D",1749074333680],[209,211,212,213,214],[96],"1afd13e4-418f-11f0-9ddb-76b3cceeab13","index.ts",["D",1749074333680],"http","import { serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { Hono } from \"npm:hono\";\n\nconst app = new Hono();\n\n// Serve index.html at the root /\napp.get(\"/\", async c => {\n return serveFile(\"/frontend/index.html\", import.meta.url);\n});\n\n// Serve all /frontend files\napp.get(\"/frontend/**/*\", c => serveFile(c.req.path, import.meta.url));\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, c) => {\n throw err;\n});\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;",[],[192,257],["D",1749074333680],[207],[192],["D",1749074333680],{"_11":12,"_145":141},{"_11":12,"_139":-5,"_140":141,"_111":112,"_142":143,"_144":48},{"_40":57,"_13":16,"_32":58,"_38":59,"_42":33,"_43":60,"_61":50,"_62":39,"_63":54,"_55":14,"_51":12},"ctx",{"_134":-5,"_167":303,"_304":305,"_306":307,"_308":48,"_309":48,"_310":48,"_311":26,"_312":-5,"_313":-7,"_314":-7,"_315":119,"_316":48,"_317":48,"_318":-5,"_319":48,"_320":48,"_321":48,"_322":-5},"ENV",{"_274":275,"_276":277,"_278":16,"_279":280,"_281":282,"_283":284,"_285":286,"_287":288,"_289":290,"_291":292,"_293":294,"_295":296,"_297":298,"_299":300,"_301":302},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Compare

Mergewolf/mainintotemplates/main

frontend/components/App.tsx+2-1