[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_210":211,"_212":213},"routes/_app.x.$handle.$name",{"_96":95,"_32":44,"_105":86,"_27":106,"_13":14,"_107":-5,"_11":108,"_109":110,"_111":112,"_113":114,"_115":116,"_20":-5,"_117":-5,"_118":-5,"_119":25,"_120":121,"_122":58,"_123":-5,"_124":-5,"_125":126},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_42":43,"_32":44,"_37":45,"_46":-5,"_47":25,"_48":49,"_50":49,"_51":52,"_53":-5,"_18":54,"_55":56,"_57":58,"_59":-5,"_60":-5,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":-5,"_68":-5,"_69":70,"_71":70,"_72":73,"_74":73,"_75":73,"_76":70,"_77":70,"_78":79,"_80":81,"_82":83,"_84":25},"version",2,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":20,"_34":36,"_37":38,"_39":14,"_40":41,"_24":25},"previous",{"_30":31,"_32":28,"_33":20,"_34":35},"deleted",false,"deletedHere","path","index.html","latestPath","fileId","01a04dc8-8fae-7098-9e26-8e19d3d7c31b","name","fileType","content","\n\n \n Hi there!\n \n \n \n\n \n \n\n \n \n\n \n \n \n \n

Hi there!

\n\n

\n I'm your cool new webpage. Made with Val Town!\n

\n \n","\n\n \n HTMX 4 + hx-live\n \n \n \n \n \n \n \n \n \n

HTMX 4

hx-live on Val Town

DOM state. Reactive bindings. One server swap.

\n view source\n

\n\n

1. Reactive counter

data-count lives on this section. :text and hx-live re-run when it changes.

\n \n \n \n

\n 0\n \n

0 / 20 (bar caps at 20)

\n\n

2. take() tabs

\n \n \n \n

This is the details pane.

\n \n \n

\n\n

3. q() + toggle()

\n \n

Pick me

\n\n

4. Server swap

HTMX 4 still fetches HTML. This button loads a fragment.

\n \n

Nothing loaded yet.

\n \n\n","createdAt",["D",1788011468301],"branchVersion","branchId","9f511862-944c-463a-b384-3c268a048bf2","id","0f019c8b-da7f-4f02-bfe5-7eaaa4bae714","htmx4-hx-live",["D",1788011384663],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","HTMX 4 hx-live counter and tabs demo","imageUrl","35ef5666-3780-42d5-ade0-86fe3fdb6bb1","pinnedFileId","01a04dc8-8fae-7098-9e26-934a08cfbcca","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","47e0b4b2-7d41-46e6-8dce-0ae3d76e1a8f","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_96":95,"_104":100},"org",{"_96":95,"_97":98,"_99":100,"_18":54,"_101":102,"_103":25},"branch",{"_13":85,"_32":86,"_42":41,"_87":43,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":44,"_94":95},"isOwned",9,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","cameronpak","handle","displayName","Cam","avatar","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/7fcc9ac1-f8fb-41e2-0168-af29ef7c6400/square512?exp=1789538399&sig=466c6eb094040d2b22d5073347b3e3f3d939c24e9366b4a0d3323fb0554fbba2","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_42":43,"_32":44,"_37":206,"_46":-5,"_47":25,"_48":49,"_50":49,"_51":52,"_53":-5,"_18":54,"_55":56,"_57":58,"_59":-5,"_60":-5,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":-5,"_68":-5,"_69":70,"_71":70,"_72":73,"_74":73,"_75":73,"_76":70,"_77":70,"_78":207,"_80":208,"_82":209,"_84":25},"tree",[181,182,183,184,185,186],"files",[181,182,183,184,185,186],"counts",{"_171":62,"_172":137,"_173":62,"_174":175,"_176":177},"contents",[127,128,129,130,131,132],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_42":165,"_32":166,"_30":167,"_136":-5,"_40":41,"_39":137,"_138":25,"_37":168,"_13":62,"_33":20,"_34":169,"_24":25,"_141":-5,"_27":170},{"_42":159,"_32":160,"_30":161,"_136":-5,"_40":41,"_39":137,"_138":58,"_37":162,"_13":62,"_33":20,"_34":163,"_24":25,"_141":-5,"_27":164},{"_42":156,"_32":28,"_30":31,"_136":-5,"_40":41,"_39":14,"_138":25,"_37":157,"_13":137,"_33":20,"_34":36,"_24":25,"_141":-5,"_27":158},{"_42":150,"_32":151,"_30":56,"_136":-5,"_40":41,"_39":137,"_138":58,"_37":152,"_13":62,"_33":153,"_34":154,"_24":25,"_141":-5,"_27":155},{"_42":143,"_32":144,"_30":145,"_136":-5,"_40":41,"_39":137,"_138":58,"_37":146,"_13":62,"_33":147,"_34":148,"_24":25,"_141":-5,"_27":149},{"_42":133,"_32":134,"_30":135,"_136":-5,"_40":41,"_39":137,"_138":25,"_37":139,"_13":62,"_33":20,"_34":140,"_24":25,"_141":-5,"_27":142},"23f5a3fc-262f-4f96-a2c6-cee36b55d85f","style.css","01a04dc8-8fae-7098-9e26-992d1d8502d8","parentId",1,"latest",["D",1788011384663],"/* CSS files add styling rules to your content */\n\nbody {\n font-family: Arial, sans-serif;\n margin: 2em;\n}\n\nh1 {\n font-style: italic;\n color: #373fff;\n}","label",[134],"94022639-c98d-48fd-9bf6-8000ab542e84","script.js","01a04dc8-8fae-7098-9e26-9543e5d88c56",["D",1788011384663],"script","/* If you're feeling fancy you can add interactivity\n to your site with Javascript.\n Note: TypeScript won't work in this file. */\n\n// prints \"hi\" in the browser's dev tools console\nconsole.log(\"hi\");",[144],"090b5d68-4b1e-4e03-9ac4-f7d226b9b651","main.tsx",["D",1788011384663],"http","import { staticHTTPServer } from \"https://esm.town/v/std/utils/index.ts\";\nexport default staticHTTPServer();",[151],"09211af8-5275-4bbb-b03e-093cf85a8054",["D",1788011468301],[28],"e8661e7e-0e99-4091-bdab-f851456fdaed","favicon.svg","01a04dc8-8fae-7098-9e26-8a64f5ea93e5",["D",1788011384663],"",[160],"0c8e8b02-3524-4096-8245-c9f7e5e4bf22","README.md","01a04dc8-8fae-7098-9e26-87176c73e376",["D",1788011384663],"# Welcome to Val Town\n\nVal Town is the simplest way to get code running in the cloud.\n\nThis is a basic HTML starter template.\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)** *(you're here)* | 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) | Client-side React SPA with a Hono API backend. |\n\n## Getting started\n\n1. Click `Remix` on this val to get a copy of it\n2. Click `main.tsx` to view the website\n3. Saves to any file will instantly deploy\n\n### ← main.tsx\n\nThis HTTP server hosts all of the other files in this val.\n\nTo view your site in a new tab, click on the `...` menu of `main.tsx` to copy\nyour live HTTP endpoint.\n\n### ← README.md\n\nThat's this file, where you can tell people what your cool website does and how\nyou built it.\n\n### ← index.html\n\nWhere you'll write the content of your website.\n\n### ← style.css\n\nCSS files add styling rules to your content.\n\n### ← script.js\n\nIf you're feeling fancy you can add interactivity to your site with JavaScript.\n\n### ← favicon.svg\n\nThe icon that shows up in the brower tab. Tip: AIs are pretty good at writing\nSVG favicons.\n\n---\n\nThis template was inspired by https://glitch.new/blank.\n",[166],"pulls","branches","forks","envVars",{"_178":62,"_180":62},"connections",{"_178":62,"_179":62},"count","unfilledCount","emptyCount",{"_42":165,"_32":166,"_30":167,"_136":-5,"_40":41,"_39":137,"_138":25,"_37":203,"_13":62,"_33":20,"_34":169,"_24":25,"_141":-5,"_188":204,"_27":205},{"_42":159,"_32":160,"_30":161,"_136":-5,"_40":41,"_39":137,"_138":58,"_37":200,"_13":62,"_33":20,"_34":163,"_24":25,"_141":-5,"_188":201,"_27":202},{"_42":156,"_32":28,"_30":31,"_136":-5,"_40":41,"_39":14,"_138":25,"_37":197,"_13":137,"_33":20,"_34":36,"_24":25,"_141":-5,"_188":198,"_27":199},{"_42":150,"_32":151,"_30":56,"_136":-5,"_40":41,"_39":137,"_138":58,"_37":194,"_13":62,"_33":153,"_34":154,"_24":25,"_141":-5,"_188":195,"_27":196},{"_42":143,"_32":144,"_30":145,"_136":-5,"_40":41,"_39":137,"_138":58,"_37":191,"_13":62,"_33":147,"_34":148,"_24":25,"_141":-5,"_188":192,"_27":193},{"_42":133,"_32":134,"_30":135,"_136":-5,"_40":41,"_39":137,"_138":25,"_37":187,"_13":62,"_33":20,"_34":140,"_24":25,"_141":-5,"_188":189,"_27":190},["D",1788011384663],"children",[],[134],["D",1788011384663],[],[144],["D",1788011384663],[],[151],["D",1788011468301],[],[28],["D",1788011384663],[],[160],["D",1788011384663],[],[166],["D",1788011384663],{"_96":95,"_104":100},{"_96":95,"_97":98,"_99":100,"_18":54,"_101":102,"_103":25},{"_13":85,"_32":86,"_42":41,"_87":43,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":44,"_94":95},"ctx",{"_78":-5,"_124":243,"_244":245,"_246":247,"_248":25,"_249":25,"_250":25,"_251":58,"_252":-5,"_253":-7,"_254":-7,"_255":62,"_256":25,"_257":25,"_258":-5,"_259":25,"_260":25,"_261":25,"_262":-5},"ENV",{"_214":215,"_216":217,"_218":86,"_219":220,"_221":222,"_223":224,"_225":226,"_227":228,"_229":230,"_231":232,"_233":234,"_235":236,"_237":238,"_239":240,"_241":242},"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"]

Diff · v2