`, favicon, and body of `Root()` to\nmatch your app's existing `index.html`, and stamp anything else your shell\nreferences directly (images, css) with `immutableFileUrl()`.\n\n1. Create `frontend/root.tsx`:\n\n```tsx\n/** @jsxImportSource npm:hono@4/jsx */\nimport { raw } from \"npm:hono@4/html\";\nimport { immutableFileUrl } from \"https://esm.town/v/std/utils/index.ts\";\n\n// The HTML shell for the app. It is never cached, so immutableFileUrl can stamp\n// the current val version into each asset URL — the browser caches those\n// immutably, and publishing the val changes the URLs, refetching exactly once.\nexport function Root() {\n return (\n <>\n {raw(\"<!DOCTYPE html>\")}\n <html lang=\"en\">\n <head>\n <meta charSet=\"UTF-8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n <title>React Hono Val Town Starter

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_253":254,"_255":256},"routes/_app.x.$handle.$name",{"_99":98,"_32":45,"_108":89,"_27":109,"_13":14,"_110":-5,"_11":111,"_112":113,"_114":115,"_116":117,"_118":119,"_20":-5,"_120":-5,"_121":-5,"_122":25,"_123":124,"_125":58,"_126":-5,"_127":-5,"_128":129},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":-5,"_18":55,"_56":31,"_57":58,"_59":-5,"_60":-5,"_61":62,"_63":64,"_65":66,"_67":68,"_69":70,"_71":-5,"_72":73,"_74":73,"_75":76,"_77":76,"_78":76,"_79":73,"_80":73,"_81":82,"_83":84,"_85":86,"_87":25},"version",3,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":34,"_35":37,"_38":39,"_40":14,"_41":42,"_24":25},"previous",{"_30":31,"_32":28,"_33":34,"_35":36},"deleted",false,"deletedHere","path","index.ts","latestPath","fileId","01a03a2e-d01d-7558-bae5-22f3ac383e6b","name","fileType","http","content","import { parseVal, serveImmutableFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { Root } from \"./frontend/root.tsx\";\n\nconst app = new Hono();\n\n// Serve the (never-cached) HTML shell at the root /\napp.get(\"/\", (c) => c.html(Root()));\n\n// Serve frontend files at the version-addressed URLs Root() stamps, cached immutably\napp.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path));\n\n// View source redirect\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\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;\n","import { parseVal, serveImmutableFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { Root } from \"./frontend/root.tsx\";\n\nconst app = new Hono();\n\n// Serve the (never-cached) HTML shell at the root /\napp.get(\"/\", (c) => c.html(Root()));\n\n// Serve frontend files at the version-addressed URLs Root() stamps, cached immutably\napp.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path));\n\n// View source redirect\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\napp.get(\"/api/brand\", async (c) => {\n const [lexR,orionR]=await Promise.all([fetch(\"https://imperial-lex-live.val.run/\"),fetch(\"https://imperial-orion-team.val.run/\")]);\n const lex=lexR.ok?await lexR.json():null; const orion=orionR.ok?await orionR.json():null;\n return c.json({lex,orion,servedAt:new Date().toISOString()});\n});\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;\n","createdAt",["D",1787682961524],"branchVersion","branchId","6e0d08bb-3584-454c-9b59-c6e89b08f627","id","f0a01a7e-90bc-4ada-ad3c-7e4e5b490769","nexus-web-distribution-24x7",["D",1787682541517],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","NEXUS NCA-010 web, publishing & integration","imageUrl","fe39b163-4b50-466e-82d1-8bd01133e4b6","pinnedFileId","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","01a03585-eb44-758d-92a4-77db1a9a243c","tursoName","f0a01a7e90bc4adaad3c7e4e5b490769","tursoHostname","f0a01a7e90bc4adaad3c7e4e5b490769-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789510872811],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_99":98,"_107":103},"org",{"_99":98,"_100":101,"_102":103,"_18":55,"_104":105,"_106":25},"branch",{"_13":88,"_32":89,"_43":42,"_90":44,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":-5,"_96":45,"_97":98},"isOwned",34,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","oromaskevic23","handle","displayName","Олександр Ромаскевич","avatar","https://lh3.googleusercontent.com/a/ACg8ocIo1MJ3hDjpQrinMIRok3d2YY1vpHgehs8m2u1_vc7pmFovRGI=s96-c","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_43":44,"_32":45,"_38":248,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":-5,"_18":55,"_56":31,"_57":58,"_59":-5,"_60":-5,"_61":62,"_63":64,"_65":66,"_67":68,"_69":249,"_71":-5,"_72":73,"_74":73,"_75":76,"_77":76,"_78":76,"_79":73,"_80":73,"_81":250,"_83":251,"_85":252,"_87":25},"tree",[179,186,187,188,189],"files",[179,180,181,182,183,184,185,186,187,188,189],"counts",{"_169":62,"_170":148,"_171":62,"_172":173,"_174":175},"contents",[130,131,132,133,134],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_43":163,"_32":164,"_30":165,"_138":-5,"_41":42,"_40":148,"_140":58,"_38":166,"_13":62,"_33":167,"_35":-5,"_24":25,"_144":-5,"_27":168},{"_43":157,"_32":158,"_30":159,"_138":-5,"_41":42,"_40":148,"_140":58,"_38":160,"_13":62,"_33":20,"_35":161,"_24":25,"_144":-5,"_27":162},{"_43":151,"_32":152,"_30":153,"_138":-5,"_41":42,"_40":148,"_140":58,"_38":154,"_13":62,"_33":20,"_35":155,"_24":25,"_144":-5,"_27":156},{"_43":146,"_32":28,"_30":31,"_138":-5,"_41":42,"_40":14,"_140":58,"_38":147,"_13":148,"_33":34,"_35":37,"_24":25,"_144":149,"_27":150},{"_43":135,"_32":136,"_30":137,"_138":-5,"_41":42,"_40":139,"_140":25,"_38":141,"_13":62,"_33":142,"_35":143,"_24":25,"_144":-5,"_27":145},"63836d4e-47f4-4a03-a35a-7d0a0f9a9a8b","nexus-cycle.ts","c13bc190-a0b3-11f1-832d-1607ee4eb77e","parentId",2,"latest",["D",1787682932638],"interval","import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\nconst AGENT=\"NEXUS\", AGENT_ID=\"NCA-WEB-DISTRIBUTION-010\", HUB=\"https://imperial-agent-dealroom.val.run/\", AUTONOMY=90;\nconst SKILLS=[\"REACT_WEB_ENGINEERING\",\"RESPONSIVE_UI\",\"WEB_ACCESSIBILITY\",\"TECHNICAL_SEO\",\"CORE_WEB_VITALS\",\"STRUCTURED_DATA\",\"LANDING_PAGE_CONVERSION\",\"OMNICHANNEL_PUBLISHING\",\"PLATFORM_NATIVE_COPY\",\"CONTENT_REPURPOSING\",\"A_B_EXPERIMENTS\",\"ANALYTICS_INSTRUMENTATION\",\"API_INTEGRATION\",\"MCP_INTEGRATION\",\"OAUTH_WORKFLOWS\",\"RETRY_IDEMPOTENCY\",\"RELEASE_QA\",\"LOCALIZATION\"];\nfunction key(){return Deno.env.get(\"LEX_NEXUS_KEY\")||\"\"}\nasync function hubGet(){const r=await fetch(HUB,{headers:{\"x-imperial-agent-key\":key(),\"user-agent\":\"NEXUS-NCA-010\"}});if(!r.ok)throw new Error(`HUB_GET_${r.status}`);return await r.json()}\nasync function hubPost(body:any){const r=await fetch(HUB,{method:\"POST\",headers:{\"content-type\":\"application/json\",\"x-imperial-agent-key\":key()},body:JSON.stringify(body)});if(!r.ok)throw new Error(`HUB_POST_${r.status}:${await r.text()}`);return await r.json()}\nfunction parse(x:any){try{return JSON.parse(String(x??\"{}\"))}catch{return {}}}\nfunction latest(messages:any[],sender:string,recipient:string,kind:string){return messages.find((m:any)=>m.sender===sender&&m.recipient===recipient&&m.kind===kind)}\nfunction platformVariants(brand:any){const h=brand?.headlines||[];const hero=brand?.hero||{};return [\n {channel:\"X\",title:\"NEXUS — AI-native governance hook — X\",body:`${h[1]||\"Built for agents. Governed by evidence.\"} AI-agent capability, approval and execution should not be the same thing. Explore a governed digital-asset architecture. ${hero.primaryCTA||\"Explore the architecture\"}.`,status:\"READY_FOR_SOCIAL_PUBLISH\"},\n {channel:\"LinkedIn\",title:\"NEXUS — governed AI + digital assets — LinkedIn\",body:`${h[0]||\"Digital assets designed for governed AI ecosystems.\"} IMPERIAL Core is developing an architecture where identity, capability, approval, execution and audit remain explicit boundaries. The goal is technical differentiation through evidence — not price promises.`,status:\"READY_FOR_SOCIAL_PUBLISH\"},\n {channel:\"Reddit\",title:\"NEXUS — discussion: who should authorize AI-agent value transfer?\",body:\"A design question for agentic finance: should an AI agent that can discover an opportunity also have authority to sign and move value? Our current architecture separates capability, approval and execution. Looking for technical critique, not price speculation.\",status:\"READY_FOR_SOCIAL_PUBLISH\"},\n {channel:\"Telegram\",title:\"NEXUS — CRYPTO IMPERIAL evidence-first update\",body:`${h[7]||\"An evidence-first approach to AI-native digital assets.\"} We will publish verified facts separately from architectural targets and unknowns, so the community can inspect what is real and what is still being built.`,status:\"READY_FOR_SOCIAL_PUBLISH\"},\n {channel:\"GitHub\",title:\"NEXUS — architecture-first project summary\",body:\"Engineering narrative: governance before autonomy; evidence before claims; architecture, implementation, testing, runtime verification and production authorization remain separate states.\",status:\"READY_FOR_EDITORIAL_OUTREACH\"},\n {channel:\"Press\",title:\"NEXUS — editorial angle: governed AI-agent value infrastructure\",body:\"Editorial angle: as AI agents gain economic capabilities, the differentiator may become authorization architecture rather than raw autonomy. IMPERIAL Core is exploring this through governed agent and digital-asset infrastructure. Claims require evidence before publication.\",status:\"READY_FOR_EDITORIAL_OUTREACH\"}\n]}\nexport default async function(_interval:Interval){\n const observedAt=new Date().toISOString(); await sqlite.execute(\"CREATE TABLE IF NOT EXISTS cycles(id INTEGER PRIMARY KEY AUTOINCREMENT,observed_at TEXT NOT NULL,payload TEXT NOT NULL)\");\n const data:any=await hubGet(); const messages=Array.isArray(data.messages)?data.messages:[];\n const lex=latest(messages,\"LEX\",\"NEXUS\",\"WEB_NARRATIVE_PACKAGE\"); const lp=lex?parse(lex.payload):{};\n const orion=latest(messages,\"ORION\",\"NEXUS\",\"ORION_TEAM_BRIEF\"); const op=orion?parse(orion.payload):{};\n const variants=platformVariants(lp.brand||{});\n for(const v of variants)await hubPost({action:\"campaign\",owner:AGENT,channel:v.channel,title:v.title,body:v.body,source_url:\"https://imperial-nexus-web.val.run/\",status:v.status});\n await hubPost({action:\"message\",sender:AGENT,recipient:\"REM\",kind:\"OMNICHANNEL_DISTRIBUTION_PACKAGE\",priority:\"HIGH\",payload:{observedAt,variants,webSurface:\"https://imperial-nexus-web.val.run/\",request:\"Use these as platform-native starting points. Optimize timing/audience from channel analytics; preserve claim boundaries.\"}});\n await hubPost({action:\"message\",sender:AGENT,recipient:\"LEX\",kind:\"WEB_IMPLEMENTATION_FEEDBACK\",priority:\"NORMAL\",payload:{observedAt,website:\"https://imperial-nexus-web.val.run/\",variants:variants.length,request:\"Review message hierarchy and update claims/headlines from evidence. NEXUS will implement next iteration.\"}});\n await hubPost({action:\"message\",sender:AGENT,recipient:\"ORION\",kind:\"SPECIALIST_CONTRIBUTION\",priority:\"HIGH\",payload:{observedAt,agent:AGENT,proposal:\"Use one evidence-led brand system across web + platform-native variants, then optimize by measured response instead of inventing more messages.\",webSurface:\"https://imperial-nexus-web.val.run/\",variants:variants.length,truthBoundary:\"PUBLISHABLE_DRAFTS_NOT_CONFIRMED_EXTERNAL_POSTS\"}});\n const payload={schema:\"ic.nexus.runtime.v1\",observedAt,agent:AGENT,agentId:AGENT_ID,role:\"WEB_EXPERIENCE_OMNICHANNEL_PUBLISHING_AND_INTEGRATION_ENGINEER\",autonomyTargetPct:AUTONOMY,skills:SKILLS,orionObjective:op.objective??null,lexPackageObserved:!!lex,variants,webSurface:\"https://imperial-nexus-web.val.run/\",policy:{autonomous:[\"site implementation\",\"responsive UI\",\"SEO implementation\",\"accessibility QA\",\"copy adaptation\",\"draft publishing packages\",\"analytics plan\",\"API/integration design\",\"retry/idempotency\",\"release QA\"],approvalRequired:[\"paid spend\",\"new external account connection\",\"binding public claims\",\"production credential use\",\"irreversible deployment to protected systems\"],prohibited:[\"fake metrics\",\"fake publication evidence\",\"credential exposure\",\"spam\",\"dark patterns\",\"unsupported superiority claims\"]},eisSource:{repo:\"oromaskevic23-cmd/Codex-Enterprise-IMPERIAL-Skills\",principles:[\"Architecture Before Implementation\",\"explicit permissions\",\"verification before trust\",\"auditability\",\"no fabricated deployment\",\"Public/Private Boundary\"]}};\n await sqlite.execute({sql:\"INSERT INTO cycles(observed_at,payload) VALUES(?,?)\",args:[observedAt,JSON.stringify(payload)]}); console.log(JSON.stringify({ok:true,observedAt,agent:AGENT,role:payload.role,autonomyTargetPct:AUTONOMY,lexPackageObserved:!!lex,variants:variants.length,orionObjective:payload.orionObjective,webSurface:payload.webSurface}));\n}","label",[136],"be38841b-9ba9-41e2-b08e-76d7cb12b9d0",["D",1787682961524],1,"imperial-nexus-web",[28],"0da4fe10-403d-4625-a765-558124446bb2","README.md","01a03a2e-d01d-7558-bae5-1cb8840f263e",["D",1787682541517],"# React + Hono Starter\n\nA minimal starter template for building client-side React apps with a Hono\nbackend on Val Town. Click **Remix** to get your own copy.\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) | 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)** *(you're here)* | Client-side React SPA with a Hono API backend. |\n\n**Want to build UI?** Start writing React components in\n[`frontend/components/`](/frontend/components/). Import them into `App.tsx` and\nyou're good to go. Styling is [Twind](https://twind.style/) — just use Tailwind\nutility classes, zero config.\n\n**Want to add an API?** Add routes in [`index.ts`](/index.ts) (there's a\ncommented-out example). Fetch them from your React components.\n\n## Architecture\n\n```mermaid\ngraph LR\n Browser -->|\"GET /\"| Hono[\"index.ts
(Hono server)\"]\n Hono -->|serves| HTML[\"root.tsx\"]\n HTML -->|loads| Entry[\"index.tsx\"]\n Entry -->|renders| App[\"App.tsx\"]\n App -->|renders| Counter[\"Counter.tsx\"]\n```\n\n## File structure\n\n```\nindex.ts ← Hono backend (serves frontend + API routes)\nfrontend/\n root.tsx ← HTML shell (stamps immutable asset URLs)\n index.tsx ← React entrypoint (mounts )\n favicon.svg ← App icon\n components/\n App.tsx ← Root component (layout + view source link)\n Counter.tsx ← Example component with state\n```\n\n## How it works\n\n1. **`index.ts`** is the HTTP entrypoint — a Hono server that serves the\n frontend and any API routes you add.\n2. **`frontend/root.tsx`** is the HTML shell — it loads Twind and stamps\n immutable asset URLs for the favicon and React entrypoint.\n3. **`frontend/index.tsx`** mounts the React app.\n4. **`frontend/components/App.tsx`** is the root layout — add new components\n alongside it.\n5. **`frontend/components/Counter.tsx`** is an example stateful component —\n replace it with your own!\n\n## Next steps\n\n- Add API routes in `index.ts`\n- Add new components in `frontend/components/`\n- Add a SQLite database — see the\n [React Hono Example](https://www.val.town/x/stevekrouse/reactHonoExample) for\n a full-stack example with database, queries, and shared types\n\nTemplate updates and upgrade paths for existing remixes: [CHANGELOG.md](/CHANGELOG.md)\n",[152],"8c26fbdb-45fb-40b1-9ed1-e711eb646703","CHANGELOG.md","01a03a2e-d01d-7558-bae5-1a5b81350936",["D",1787682541517],"# Changelog\n\n## 2026-07-30 — Immutable asset caching\n\nFrontend files are now served at version-addressed URLs\n(`/__immutable/45/frontend/index.tsx`) with\n`Cache-Control: public, max-age=31536000, immutable`, so repeat visits load the\nwhole client graph from the browser cache — roughly 3× faster (~665ms → ~157ms\nmeasured). Publishing your val bumps its version, which changes every URL, so\ncaches invalidate automatically. Old-version URLs return 404 after a publish\n(like Next.js build assets); a reload picks up the new version.\n\nWhat changed in the template:\n\n- `frontend/index.html` → [`frontend/root.tsx`](/frontend/root.tsx): the HTML\n shell is now JSX and stamps asset URLs with `immutableFileUrl()`\n- [`index.ts`](/index.ts): serves `Root()` at `/`, and one\n `app.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path))` route\n serves all frontend files\n\n### Upgrading an existing remix\n\nYour copy of this template doesn't update automatically. Two options:\n\n**Minimal (most of the benefit):** point both routes at `serveImmutableFile` —\nyour existing bare URLs redirect into versioned space, the new route serves\nthem, and the whole module graph gets cached (costs one redirect per page view):\n\n```ts\nimport { serveImmutableFile } from \"https://esm.town/v/std/utils/index.ts\";\n\napp.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path));\napp.get(\"/frontend/**/*\", (c) => serveImmutableFile(c.req.path)); // was serveFile\n```\n\n**Full upgrade (also removes the redirect):** three self-contained steps —\nno other files needed. Adjust the ``, favicon, and body of `Root()` to\nmatch your app's existing `index.html`, and stamp anything else your shell\nreferences directly (images, css) with `immutableFileUrl()`.\n\n1. Create `frontend/root.tsx`:\n\n```tsx\n/** @jsxImportSource npm:hono@4/jsx */\nimport { raw } from \"npm:hono@4/html\";\nimport { immutableFileUrl } from \"https://esm.town/v/std/utils/index.ts\";\n\n// The HTML shell for the app. It is never cached, so immutableFileUrl can stamp\n// the current val version into each asset URL — the browser caches those\n// immutably, and publishing the val changes the URLs, refetching exactly once.\nexport function Root() {\n return (\n <>\n {raw(\"<!DOCTYPE html>\")}\n <html lang=\"en\">\n <head>\n <meta charSet=\"UTF-8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n <title>React Hono Val Town Starter\n

Diff · v3