[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_223":224,"_225":226},"routes/_app.x.$handle.$name",{"_106":105,"_37":49,"_114":92,"_32":115,"_13":14,"_116":-5,"_11":117,"_118":119,"_120":121,"_122":123,"_124":125,"_26":-5,"_126":127,"_128":129,"_130":30,"_131":132,"_133":64,"_134":-5,"_135":-5,"_136":137},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_47":48,"_37":49,"_42":50,"_51":-5,"_52":30,"_53":54,"_55":54,"_56":57,"_58":59,"_19":60,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":-5,"_72":-5,"_73":-5,"_74":-5,"_75":76,"_77":76,"_78":79,"_80":79,"_81":79,"_82":76,"_83":76,"_84":85,"_86":87,"_88":89,"_90":30},"version",2,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","1b2b6856-6f5a-4720-a1c6-290b6bf347a7","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":-7,"_29":30,"_31":30,"_32":33,"_34":33},"file",{"_35":36,"_37":33,"_38":39,"_40":41,"_42":43,"_44":14,"_45":46,"_29":30},"previous","deleted",false,"deletedHere","path","og-image.tsx","latestPath","fileId","861c98c0-7564-11f1-a6b7-1607ee4eb77e","name","fileType","script","content","/**\n * Dynamically generated SVG OG images so the previews actually render\n * without any external asset hosting.\n *\n * - `summary` cards want roughly a square image (min 144x144, shown ~1:1)\n * - `summary_large_image` cards want a wide 1200x630 (1.91:1) image\n */\n\nexport function squareOgImage(): string {\n return ``;\n}\n\nexport function wideOgImage(): string {\n return ``;\n}\n","createdAt",["D",1782921003213],"branchVersion","branchId","40c98fa3-0bb8-41ca-9387-d8a4628fb57e","id","70cb3497-f125-4417-b568-23271f812949","og-card-demo",["D",1782920987381],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Demo: summary vs summary_large_image OG/Twitter card previews","imageUrl","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/c0239427-e00f-4148-05e5-9ae43f5d9900/square512?exp=1789595999&sig=fae13974a2170d2b85e72a310224c3d26885ac1d8fb40572a53be838ba59fb78","e11b29b4-b61d-4f5b-b211-2caff2e4f525","pinnedFileId","019f1e5f-437d-7454-b1bc-b5c6a5292c11","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","b99e173b-76ed-4c5a-b6da-ed4dafe29bec","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_106":105,"_113":109},"org",{"_106":105,"_107":-5,"_108":109,"_19":60,"_110":111,"_112":30},"branch",{"_13":91,"_37":92,"_47":46,"_93":48,"_94":95,"_96":97,"_98":54,"_99":100,"_101":102,"_103":49,"_104":105},"isOwned",8,"main","projectId","forkedBranchId","69713bf6-594c-11f1-a5c4-ee650bb23af1","forkedBranchVersion",20,"forkedProjectPrivacy","forkedProjectId","69708896-594c-11f1-a5c4-ee650bb23af1","forkedProjectOrgId","019aa807-52c2-709c-928b-2029bae9a558","projectName","userHandle","hacksore","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yZVBaRzNrZmpHQ1FZTDdleExsS081c1VkNHgifQ","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_47":48,"_37":49,"_42":219,"_51":-5,"_52":30,"_53":54,"_55":54,"_56":57,"_58":59,"_19":60,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":-5,"_72":-5,"_73":-5,"_74":-5,"_75":76,"_77":76,"_78":79,"_80":79,"_81":79,"_82":76,"_83":76,"_84":220,"_86":221,"_88":222,"_90":30},"tree",[186,189,190,191],"files",[186,187,188,189,190,191],"counts",{"_176":68,"_177":160,"_178":68,"_179":180,"_181":182},"contents",[148,149,150,151],"upstreamProject",{"_47":100,"_37":144,"_56":145,"_58":59,"_53":54,"_84":146},"upstreamBranch",{"_47":95,"_42":138,"_139":140,"_37":92,"_93":100,"_13":97,"_94":-5,"_96":-5,"_141":142,"_51":-5,"_90":30,"_53":54,"_104":143,"_69":102,"_103":144},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1779832014660],"updatedAt",["D",1779896135471],"lockfileKey","1779896174494-esm.town_v_templates_hono-jsx-starter@20-main","templates","hono-jsx-starter","Minimal Hono JSX starter for Val Town",{"_106":143,"_113":147},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789595999&sig=5ce53d553f31a4c291a4ca5660b7f712b9aba9a0d43f432f1aaacd8970ef293d",{"_47":171,"_37":54,"_35":172,"_153":-5,"_45":46,"_44":160,"_154":64,"_42":173,"_13":68,"_38":174,"_40":-5,"_29":30,"_156":-5,"_32":175},{"_47":165,"_37":166,"_35":167,"_153":-5,"_45":46,"_44":160,"_154":30,"_42":168,"_13":68,"_38":26,"_40":169,"_29":30,"_156":-5,"_32":170},{"_47":158,"_37":159,"_35":62,"_153":-5,"_45":46,"_44":160,"_154":30,"_42":161,"_13":68,"_38":162,"_40":163,"_29":30,"_156":-5,"_32":164},{"_47":152,"_37":33,"_35":36,"_153":-5,"_45":46,"_44":14,"_154":64,"_42":155,"_13":68,"_38":39,"_40":41,"_29":30,"_156":-5,"_32":157},"927ecf60-a383-4723-a091-ecfd8d99f5dc","parentId","latest",["D",1782921003213],"label",[33],"7b065394-2ff4-46b8-ae08-ea7689975377","index.tsx",1,["D",1782920987381],"http","/** @jsxImportSource npm:hono@4/jsx */\nimport { Hono } from \"npm:hono@4\";\nimport { parseVal, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\n\n// In-memory state. Resets whenever the server restarts.\n// For persistence across restarts, use std/sqlite or std/blob.\nlet count = 0;\n\nconst Layout = ({ title, children }: { title: string; children: any }) => (\n \n \n {title}\n \n \n \n \n \n \n \n {children}\n \n \n);\n\nconst app = new Hono();\n\napp.get(\"/\", (c) =>\n c.html(\n \n

Hello from Hono JSX

\n A minimal Val Town starter.{\" \"}\n \n Remix this val.\n \n

\n Server count:{\" \"}\n {count}\n

\n \n Increment\n \n

\n Lives in memory on the server. Resets when the val restarts.\n

\n \n ,\n ));\n\napp.get(\"/about\", (c) =>\n c.html(\n \n

About

Server-rendered with Hono JSX on Val Town.

\n ,\n ));\n\n// API routes\napp.post(\"/api/increment\", (c) => c.json({ count: ++count }));\n\n// Serve static files\napp.get(\"/public/*\", (c) => serveFile(c.req.path));\n\n// View source on Val Town\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// Unwrap and rethrow Hono errors as the original error\napp.onError((err) => Promise.reject(err));\n\nexport default app.fetch;",[159],"77c973b6-4d69-45f5-9785-69756eebdbf4","README.md","019f1e5f-437d-7454-b1bc-b05f88f3c4d4",["D",1782920987381],"# hono-jsx-starter\n\nA minimal [Hono](https://hono.dev) + Hono JSX starter for Val Town.\nServer-rendered HTML, no build step, no React.\n\n## Picking a starter\n\n| Starter | When to pick it |\n| --- | --- |\n| [`basic-html-starter`](https://www.val.town/x/templates/basic-html-starter) | Static HTML pages. Sprinkle of vanilla JS. No server-side rendering. |\n| **[`hono-jsx-starter`](https://www.val.town/x/templates/hono-jsx-starter)** *(you're here)* | Dynamic server-rendered HTML with JSX. API routes. No React, no SPA. |\n| [`react-hono-starter`](https://www.val.town/x/templates/react-hono-starter) | Client-side React SPA with a Hono API backend. |\n\n## What's here\n\n```\nindex.tsx Hono app, Layout, routes\npublic/\n favicon.svg Static asset\n counter.ts Tiny client-side script\n```\n\nThe whole app fits in one file. As you grow it, the natural next moves are:\n\n- Pull `Layout` into its own `.tsx` file once you have 3+ pages.\n- Split routes with `app.route(\"/api\", api)` if `/api/*` grows.\n- Add more files under `public/` — they're served by a single\n `app.get(\"/public/*\", ...)` route.\n\n## Patterns worth knowing\n\n**JSX pragma.** Every `.tsx` file that uses JSX needs this at the top:\n\n```tsx\n/** @jsxImportSource npm:hono@4/jsx */\n```\n\n**Server state.** The counter on `/` is `let count = 0` at module scope. It\nlives in memory on the Val Town server and survives across requests — but resets\nwhenever the val restarts (deploys, idle timeouts, etc.). For persistent state,\nswap it for [`std/sqlite`](https://www.val.town/x/std/sqlite) or\n[`std/blob`](https://www.val.town/x/std/blob).\n\n**API routes.** The `Increment` button POSTs to `/api/increment`, which returns\nJSON. Mix server-rendered pages and JSON endpoints in the same Hono app:\n\n```ts\napp.post(\"/api/increment\", (c) => c.json({ count: ++count }));\n```\n\n**Static files.** `serveFile` reads the file by path and serves it with the\nright content-type. `.ts` files are transpiled to JS on request by Val Town — so\nyou can write `public/counter.ts` and reference it as\n`

Diff · v2