[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_165":166,"_167":168},"routes/_app.x.$handle.$name",{"_96":95,"_32":45,"_104":86,"_27":53,"_13":14,"_105":-5,"_11":106,"_107":108,"_109":110,"_111":112,"_113":114,"_20":-5,"_115":-5,"_116":-5,"_117":25,"_118":119,"_120":58,"_121":-5,"_122":-5,"_123":124},"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":58,"_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",5,"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","router.ts","latestPath","fileId","20a64482-b9d0-11f0-9c03-0224a6c84d84","name","fileType","http","content","import {\n createRouter,\n createRoutes,\n html,\n} from \"npm:@remix-run/fetch-router@0.6.0\";\n// test\n\n// Keep all data in-memory for this example\ntype Post = {\n slug: string;\n title: string;\n content: string;\n};\n\n\n\nlet posts: Array = [];\n\n// Setup routes & router\nlet routes = createRoutes({\n home: \"/\",\n blog: {\n index: { method: \"GET\", pattern: \"/blog\" },\n create: { method: \"POST\", pattern: \"/blog\" },\n new: { method: \"GET\", pattern: \"/blog/new\" },\n show: { method: \"GET\", pattern: \"/blog/:slug\" },\n edit: { method: \"GET\", pattern: \"/blog/:slug/edit\" },\n update: { method: \"PUT\", pattern: \"/blog/:slug\" },\n destroy: { method: \"DELETE\", pattern: \"/blog/:slug\" },\n },\n});\nlet router = createRouter({\n parseFormData: true,\n methodOverride: \"_method\",\n});\n\n// Global logging middleware\nrouter.use((context, next) => {\n console.log(`${context.request.method} ${context.url.pathname}`);\n return next();\n});\n\n// Bulk register routes with middleware\nrouter.map(routes, {\n home() {\n return Page({\n title: \"Home\",\n href: routes.home.href(),\n children: `\n

Remix 3 Fetch Router Demo

\n This is a demo of the \n Remix 3 fetch-router\n and how simple yet awesome it is.\n

\n `,\n });\n },\n blog: {\n index() {\n return Page({\n title: \"Posts\",\n href: routes.blog.index.href(),\n children: `\n

Blog Posts

+ New Post
\n \n ${p.title}\n \n

\n `,\n });\n },\n new() {\n return Page({\n title: \"New Post\",\n href: routes.blog.new.href(),\n children: `\n

New Post

\n \n `,\n });\n },\n async create({ request, formData }) {\n let post = {\n slug: Date.now().toString(),\n title: formData.get(\"title\"),\n content: formData.get(\"content\"),\n };\n posts.push(post);\n\n const to = new URL(\n routes.blog.show.href({ slug: post.slug }),\n request.url,\n );\n return Response.redirect(to, 303);\n },\n show({ params }) {\n let post = posts.find((post) => post.slug === params.slug);\n if (!post) return new Response(\"Not Found\", { status: 404 });\n\n return Page({\n title: post.title,\n href: routes.blog.show.href({ slug: params.slug }),\n children: `\n

${post.title}

${post.content}

\n \n \n `,\n });\n },\n edit({ params }) {\n let post = posts.find((post) => post.slug === params.slug);\n if (!post) return new Response(\"Not Found\", { status: 404 });\n\n return Page({\n title: `Edit ${post.title}`,\n href: routes.blog.edit.href({ slug: params.slug }),\n children: `\n

Edit Post

\n \n `,\n });\n },\n async update({ formData, params, request }) {\n let post = posts.find((post) => post.slug === params.slug);\n if (!post) return new Response(\"Not Found\", { status: 404 });\n\n post.title = formData.get(\"title\");\n post.content = formData.get(\"content\");\n\n // Response here needs a fully qualified URL, not just a path\n const to = new URL(\n routes.blog.show.href({ slug: params.slug }),\n request.url,\n );\n return Response.redirect(to, 303);\n },\n destroy({ params, request }) {\n let post = posts.find((post) => post.slug === params.slug);\n if (!post) return new Response(\"Not Found\", { status: 404 });\n\n posts = posts.filter((post) => post.slug !== params.slug);\n\n const to = new URL(routes.blog.index.href(), request.url);\n return Response.redirect(to, 303);\n },\n },\n});\n\nexport { router };\n\n/**\n * Templates\n */\n\nfunction Page(\n { title, href, children }: { title: string; href: string; children: string },\n) {\n return html(`\n\n \n ${title}\n \n \n \n ${Nav(href)}\n ${children}\n \n`);\n}\n\nfunction Nav(href?: string) {\n return ``;\n}\n\nexport default (req: Request) => router.fetch(req);","import { createRouter, createRoutes, html } from \"npm:@remix-run/fetch-router@0.6.0\";\n// test\n\nexport default (req: Request) => router.fetch(req);","createdAt",["D",1762296571938],"branchVersion","branchId","201b6d12-b9d0-11f0-9a6b-0224a6c84d84","id","201af044-b9d0-11f0-9a6b-0224a6c84d84","fetch-router",["D",1762296399138],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","","imageUrl","4555dd0e-707e-4444-acd3-049d206eb1db","pinnedFileId","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","bced381e-9ab2-4b55-929d-e7c5064f7f38","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_96":95,"_103":99},"org",{"_96":95,"_97":-5,"_98":99,"_18":55,"_100":101,"_102":25},"branch",{"_13":85,"_32":86,"_43":42,"_87":44,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":45,"_94":95},"isOwned",12,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","wolf","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJvVXpPVUZRTjZGTGd2Q2t4c0RRdFpNZWJ5UCJ9","tier","pro","canRestrictVals","profileImageUrl","branchName","adoptOrgId",{"_43":44,"_32":45,"_38":161,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":-5,"_18":55,"_56":31,"_57":58,"_59":58,"_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":162,"_80":163,"_82":164,"_84":25},"tree",[152,153],"files",[152,153],"counts",{"_141":62,"_142":143,"_144":62,"_145":146,"_147":148},"contents",[125,126],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_43":134,"_32":135,"_30":136,"_128":-5,"_41":42,"_40":137,"_129":58,"_38":138,"_13":62,"_33":20,"_35":139,"_24":25,"_132":-5,"_27":140},{"_43":127,"_32":28,"_30":31,"_128":-5,"_41":42,"_40":14,"_129":25,"_38":130,"_13":131,"_33":34,"_35":37,"_24":25,"_132":-5,"_27":133},"871c3618-b9d0-11f0-8220-0224a6c84d84","parentId","latest",["D",1762296571938],3,"label",[28],"20af022a-b9d0-11f0-bca4-0224a6c84d84","README.md","20af02e8-b9d0-11f0-bca4-0224a6c84d84",2,["D",1762296400095],"# Remix 3: `fetch-router`\n\nOriginally copy/pasted the \"complete blog\" example from the fetch-router docs\nand, through that process,\n[found a few things that didn’t quite work](https://github.com/remix-run/remix/pull/10778).\nSo I made tweaks and came up with this val.\n\nThis is meant to be an interesting, basic example of what the fetch-router gives\nyou out of the box — and how you can stitch together a system of URLs in a type\nsafe way.",[135],"pulls","branches",1,"forks","envVars",{"_149":143,"_151":62},"connections",{"_149":62,"_150":62},"count","unfilledCount","emptyCount",{"_43":134,"_32":135,"_30":136,"_128":-5,"_41":42,"_40":137,"_129":58,"_38":158,"_13":62,"_33":20,"_35":139,"_24":25,"_132":-5,"_155":159,"_27":160},{"_43":127,"_32":28,"_30":31,"_128":-5,"_41":42,"_40":14,"_129":25,"_38":154,"_13":131,"_33":34,"_35":37,"_24":25,"_132":-5,"_155":156,"_27":157},["D",1762296571938],"children",[],[28],["D",1762296400095],[],[135],["D",1762296399138],{"_96":95,"_103":99},{"_96":95,"_97":-5,"_98":99,"_18":55,"_100":101,"_102":25},{"_13":85,"_32":86,"_43":42,"_87":44,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":45,"_94":95},"ctx",{"_78":-5,"_122":198,"_199":200,"_201":202,"_203":25,"_204":25,"_205":25,"_206":58,"_207":-5,"_208":-7,"_209":-7,"_210":62,"_211":25,"_212":25,"_213":-5,"_214":25,"_215":25,"_216":25,"_217":-5},"ENV",{"_169":170,"_171":172,"_173":86,"_174":175,"_176":177,"_178":179,"_180":181,"_182":183,"_184":185,"_186":187,"_188":189,"_190":191,"_192":193,"_194":195,"_196":197},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","5015b8df46402d8bba4f485ecc37aec202b0e06b","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 · v5