[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_413":414,"_415":416},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":-7,"_18":19,"_17":-7,"_301":-5,"_20":302,"_22":303,"_304":305,"_306":307,"_26":308,"_24":309,"_310":311,"_312":313,"_314":51,"_315":316,"_317":73,"_318":-5,"_319":-5,"_320":321},"routes/_app.x.$handle.$name.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":25,"_26":27,"_28":29,"_30":-5,"_31":32,"_33":34,"_35":-5},"handle","shouser","name","vt_blog","branchName","main","version","path","components","project",{"_36":257,"_13":14,"_38":258,"_49":-5,"_259":51,"_52":53,"_260":53,"_261":-5,"_262":-5,"_263":264,"_265":107,"_266":73,"_267":-5,"_268":-5,"_269":34,"_56":270,"_271":-5,"_272":-5,"_273":-5,"_274":-5,"_275":276,"_277":276,"_278":279,"_280":279,"_281":279,"_282":276,"_283":276,"_284":285,"_286":287,"_288":289,"_50":51},"tree",[98,99,100,101,102,103,104],"file",{"_36":94,"_13":19,"_65":68,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":95,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_18":97},"contents",[60,61,62],"upstream",{"_36":37,"_38":39,"_40":41,"_13":16,"_42":43,"_17":44,"_45":-5,"_46":-5,"_47":48,"_49":-5,"_50":51,"_52":53,"_54":55,"_56":57,"_58":59},"pull","ahead",0,"behind",1,"envVars","id","879fa4b6-0fc7-11f0-8592-569c3dd06744","createdAt",["D",1743601009671],"updatedAt",["D",1786979631389],"projectId","879f10be-0fc7-11f0-8592-569c3dd06744",194,"forkedBranchId","forkedBranchVersion","lockfileKey","1786979631504-esm.town_v_stevekrouse_original-vt-blog@194-main","deletedAt","isOwned",false,"privacy","public","userHandle","stevekrouse","orgId","e81e7335-6d4c-4764-a902-d0962bbfa9f7","projectName","original-vt-blog",{"_36":88,"_13":89,"_65":90,"_67":68,"_69":70,"_71":34,"_72":73,"_38":91,"_17":32,"_75":76,"_77":92,"_79":51,"_80":-5,"_18":93},{"_36":82,"_13":83,"_65":84,"_67":68,"_69":70,"_71":34,"_72":73,"_38":85,"_17":32,"_75":76,"_77":86,"_79":51,"_80":-5,"_18":87},{"_36":63,"_13":64,"_65":66,"_67":68,"_69":70,"_71":34,"_72":73,"_38":74,"_17":32,"_75":76,"_77":78,"_79":51,"_80":-5,"_18":81},"d8260508-13b2-11f0-a418-569c3dd06744","Layout.tsx","fileId","5072edaf-0430-49c9-b49e-13d7b944e334","parentId","34389b00-df1e-4738-a46a-c8671c007fe9","branchId","d823ec5a-13b2-11f0-a418-569c3dd06744","branchVersion","latest",true,["D",1744031929960],"fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\n\ninterface LayoutProps {\n title: string;\n children: React.ReactNode;\n}\n\nexport function Layout({ title, children }: LayoutProps) {\n return (\n \n \n \n \n {title}\n \n \n \n \n \n \n \n

\n \n \n Val Town Blog\n \n

\n {children}\n

\n \n \n );\n}","deleted","label",[19,64],"d8260350-13b2-11f0-a418-569c3dd06744","HomePage.tsx","7b700ce3-7ff3-4aa6-8621-51f44ac5d022",["D",1744031929960],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\nimport { BlogPost } from \"../utils/types.ts\";\nimport { Layout } from \"./Layout.tsx\";\n\nfunction formatDate(dateString: string): string {\n try {\n const date = new Date(dateString);\n const month = date.toLocaleString('default', { month: 'short' });\n const day = date.getDate();\n const year = date.getFullYear();\n return `${month} ${day}, ${year}`;\n } catch (e) {\n return dateString;\n }\n}\n\nexport function HomePage({ posts }: { posts: BlogPost[] }) {\n return (\n \n

\n {posts.map((post, index) => (\n

\n {post.title}\n

\n {post.author}\n •\n {formatDate(post.pubDate)}\n

\n {post.description}\n

\n ))}\n

\n \n );\n}",[19,83],"d825f086-13b2-11f0-a418-569c3dd06744","BlogPost.tsx","06aed5b7-ab81-4ac6-a3b6-b81623d02654",["D",1744031929960],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\nimport { BlogPost as BlogPostType } from \"../utils/types.ts\";\nimport { Layout } from \"./Layout.tsx\";\n\ninterface BlogPostProps {\n post: BlogPostType;\n content: string;\n}\n\nfunction formatDate(dateString: string): string {\n try {\n const date = new Date(dateString);\n return date.toLocaleDateString('en-US', {\n year: 'numeric',\n month: 'long',\n day: 'numeric'\n });\n } catch (e) {\n return dateString;\n }\n}\n\nexport function BlogPostComponent({ post, content }: BlogPostProps) {\n return (\n \n

{post.title}

\n {post.author}\n •\n {formatDate(post.pubDate)}\n

\n \n );\n}",[19,89],"d8265da0-13b2-11f0-a418-569c3dd06744",["D",1744031929960],"directory",[19],{"_36":94,"_13":19,"_65":68,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":242,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_111":243,"_18":244},{"_36":220,"_13":221,"_65":222,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":223,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_111":224,"_18":225},{"_36":182,"_13":183,"_65":184,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":185,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_111":186,"_18":187},{"_36":128,"_13":129,"_65":130,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":131,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_111":132,"_18":133},{"_36":121,"_13":122,"_65":123,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":124,"_17":32,"_75":24,"_77":125,"_79":51,"_80":-5,"_111":126,"_18":127},{"_36":114,"_13":115,"_65":116,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":117,"_17":32,"_75":24,"_77":118,"_79":51,"_80":-5,"_111":119,"_18":120},{"_36":105,"_13":106,"_65":107,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":108,"_17":32,"_75":109,"_77":110,"_79":51,"_80":-5,"_111":112,"_18":113},"d826bcbe-13b2-11f0-a418-569c3dd06744","index.ts","79bfdfae-e339-44a8-ac65-3862837ec6dc",["D",1744031929960],"http","import { Hono } from \"https://esm.sh/hono@3.12.0\";\nimport blogRoutes from \"./routes/blog.ts\";\nimport homeRoutes from \"./routes/home.ts\";\nimport proxyRoutes from \"./routes/proxy.ts\";\nimport rssRoute from \"./routes/rss.ts\";\n\nconst app = new Hono();\n\napp.route(\"/\", homeRoutes);\napp.route(\"/blog/*\", blogRoutes);\napp.route(\"/rss.xml\", rssRoute);\n\n// Everything else, proxy to the old blog\napp.route(\"*\", proxyRoutes);\n\n// Unwrap Hono errors to see original error details\napp.onError((err: any, c: any) => {\n throw err;\n});\n\n// Export the fetch handler for Val Town\nexport default app.fetch;","children",[],[106],"d826bb6a-13b2-11f0-a418-569c3dd06744","TODOs.md","56c690be-6545-4320-a1f7-cf9ddb006fb4",["D",1744031929960],"",[],[115],"d826b7be-13b2-11f0-a418-569c3dd06744","README.md","dce2af49-e64a-4616-ba7d-7d00c530a7cc",["D",1744031929960],"# Val Town Blog\n\n## Overview\n\nThe Val Town Blog has undergone a migration from its original hosting on Astro and Cloudflare Pages to being hosted directly on Val Town. This repository contains the code that powers the current blog implementation.\n\n## How It Works\n\n### Blog Architecture\n\n- **New Posts**: New blog posts are written in markdown with YAML frontmatter and stored in the `/blog-posts` directory\n- **Legacy Posts**: For older blog posts, we proxy requests to the original blog hosted at Cloudflare Pages\n- **Homepage**: The homepage is dynamically constructed by:\n 1. Reading local markdown files from the `/blog-posts` directory\n 2. Parsing the RSS feed from the old blog at `https://val-town-blog.pages.dev/rss.xml`\n 3. Merging and sorting the posts by date\n 4. Rendering the combined content with a consistent design using Tailwind CSS\n\n### Components Structure\n\n- **`/index.tsx`**: Main entry point that handles routing and proxying\n- **`/components/`**: React components for rendering the blog\n - **`Layout.tsx`**: Shared layout component with header and Tailwind setup\n - **`HomePage.tsx`**: Renders the blog homepage with the list of posts\n - **`BlogPost.tsx`**: Renders individual blog posts\n- **`/utils/blogPosts.ts`**: Utilities for fetching, parsing, and caching blog posts\n- **`/blog-posts/`**: Directory containing markdown files for blog posts\n\n### Technical Stack\n\n- **React**: For rendering components\n- **Tailwind CSS**: For styling (via CDN)\n- **Unified/Remark/Rehype**: For markdown processing with GitHub Flavored Markdown support\n- **RSS Parser**: For fetching posts from the old blog's RSS feed\n- **Gray Matter**: For parsing YAML frontmatter\n\n## Adding New Blog Posts\n\nTo add a new blog post to the Val Town Blog:\n\n1. Create a markdown file in the `/blog-posts` directory with YAML frontmatter:\n\n```markdown\n---\ntitle: My New Blog Post\ndescription: A brief description of the post\npubDate: 2025-04-01T00:00:00.000Z\nauthor: Your Name\n---\n\nContent of your blog post in markdown format...\n```\n\n2. The post will automatically appear on the homepage and be accessible at `/blog/[filename]` (without the .md extension)\n\n## Markdown Features\n\nThe blog supports GitHub Flavored Markdown (GFM) with:\n\n- Tables\n- Task lists\n- Strikethrough\n- Autolinks\n- Code syntax highlighting\n- Heading IDs (via rehype-slug)\n\n## Development\n\nWhen modifying the blog system:\n\n1. Update the React components in the `/components` directory\n2. Modify the blog post utilities in `/utils/blogPosts.ts`\n3. Test changes by visiting the homepage and individual blog posts\n4. For styling changes, use Tailwind CSS classes\n\n## Caching\n\nBlog posts are cached in memory to improve performance:\n\n- The cache is initialized when the server starts\n- It has a TTL of 5 minutes before being refreshed\n- This reduces the need to read files and parse RSS on every request",[],[122],"d826b638-13b2-11f0-a418-569c3dd06744","utils","826f5d91-55e4-4d36-bcda-7424d8ac7445",["D",1744031929960],[134,135,136,137,138,139],[129],{"_36":175,"_13":176,"_65":177,"_67":130,"_69":70,"_71":34,"_72":73,"_38":178,"_17":32,"_75":76,"_77":179,"_79":51,"_80":-5,"_111":180,"_18":181},{"_36":168,"_13":169,"_65":170,"_67":130,"_69":70,"_71":34,"_72":73,"_38":171,"_17":32,"_75":76,"_77":172,"_79":51,"_80":-5,"_111":173,"_18":174},{"_36":161,"_13":162,"_65":163,"_67":130,"_69":70,"_71":34,"_72":73,"_38":164,"_17":32,"_75":76,"_77":165,"_79":51,"_80":-5,"_111":166,"_18":167},{"_36":154,"_13":155,"_65":156,"_67":130,"_69":70,"_71":34,"_72":73,"_38":157,"_17":32,"_75":76,"_77":158,"_79":51,"_80":-5,"_111":159,"_18":160},{"_36":147,"_13":148,"_65":149,"_67":130,"_69":70,"_71":34,"_72":73,"_38":150,"_17":32,"_75":76,"_77":151,"_79":51,"_80":-5,"_111":152,"_18":153},{"_36":140,"_13":141,"_65":142,"_67":130,"_69":70,"_71":34,"_72":73,"_38":143,"_17":32,"_75":76,"_77":144,"_79":51,"_80":-5,"_111":145,"_18":146},"d8269162-13b2-11f0-a418-569c3dd06744","types.ts","16801e14-ec5c-4e2f-a1d4-268cc7ca454b",["D",1744031929960],"export type BlogPost = {\n title: string;\n link: string;\n description: string;\n pubDate: string;\n author: string;\n content?: string;\n slug?: string;\n};",[],[129,141],"d8268ff0-13b2-11f0-a418-569c3dd06744","render-markdown.ts","5a1658bf-5920-4e9c-a8f1-404dff9325f6",["D",1744031929960],"import rehypeHighlight from \"npm:rehype-highlight\";\nimport rehypeSlug from \"npm:rehype-slug\";\nimport rehypeStringify from \"npm:rehype-stringify\";\nimport remarkFrontmatter from \"npm:remark-frontmatter\";\nimport remarkGfm from \"npm:remark-gfm\";\nimport remarkParse from \"npm:remark-parse\";\nimport remarkRehype from \"npm:remark-rehype\";\nimport { unified } from \"npm:unified\";\n\n// Process markdown content\nexport async function processMarkdown(content: string): Promise {\n const result = await unified()\n .use(remarkParse)\n .use(remarkGfm)\n .use(remarkRehype)\n .use(rehypeSlug)\n .use(rehypeHighlight)\n .use(rehypeStringify)\n .process(content);\n\n return result.toString();\n}",[],[129,148],"d8268e38-13b2-11f0-a418-569c3dd06744","posts.ts","2ab4d7b2-6cbf-4c77-8a57-063100343c4c",["D",1744031929960],"import { getAllBlogPosts } from \"./get-posts.ts\";\n\nexport const posts = await getAllBlogPosts();",[],[129,155],"d82688ca-13b2-11f0-a418-569c3dd06744","get-posts.ts","2062b8f9-0701-44da-bac2-d11161a225f6",["D",1744031929960],"import { getBlogPostBySlug, getNewPosts } from \"./get-new-posts.ts\";\nimport { getOldPosts } from \"./get-old-posts.ts\";\nimport { type BlogPost } from \"./types.ts\";\n\n// Get all blog posts (local + RSS)\nexport async function getAllBlogPosts(): Promise {\n return (await Promise.all([\n getNewPosts(),\n getOldPosts(),\n ])).flat()\n .sort((a, b) => {\n return new Date(b.pubDate).getTime() - new Date(a.pubDate).getTime();\n });\n}",[],[129,162],"d8267114-13b2-11f0-a418-569c3dd06744","get-old-posts.ts","303e4158-fc37-4528-9b93-efd3d136cfa5",["D",1744031929960],"import RssParser from \"npm:rss-parser\";\nimport { BlogPost } from \"./types.ts\";\n\nconst OLD_BLOG_RSS = \"https://val-town-blog.pages.dev/rss.xml\";\n// Get blog posts from RSS feed\nexport async function getOldPosts(): Promise {\n const parser = new RssParser();\n const feed = await parser.parseURL(OLD_BLOG_RSS);\n return feed.items.map(item => ({\n title: item.title || \"Untitled\",\n slug: item?.link?.split(\"/\")?.at(-2),\n link: \"/blog/\" + item?.link?.split(\"/\")?.at(-2),\n description: item.contentSnippet || \"\",\n pubDate: item.pubDate || new Date().toISOString(),\n author: item.creator || \"Val Town Team\",\n }));\n}",[],[129,169],"d8266fd4-13b2-11f0-a418-569c3dd06744","get-new-posts.ts","69fa7f8c-d5a5-43e2-b044-8510d78920d7",["D",1744031929960],"import { listFiles, readFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport matter from \"npm:gray-matter\";\nimport { BlogPost } from \"./types.ts\";\n\n// Get all blog posts from the file system\nexport async function getNewPosts(): Promise {\n const files = await listFiles(import.meta.url);\n const blogPostFiles = files.filter(\n file =>\n file.path.startsWith(\"posts/\")\n && file.path !== \"posts/EXAMPLE.md\",\n );\n\n const posts: BlogPost[] = [];\n\n for (const file of blogPostFiles) {\n const content = await readFile(file.path, import.meta.url);\n const { data, content: markdownContent } = matter(content);\n\n // Skip if required frontmatter is missing\n if (!data.title || !data.pubDate) continue;\n\n const slug = file.path.replace(\"/posts/\", \"\").replace(\".md\", \"\");\n\n posts.push({\n title: data.title,\n link: `/blog/${slug}`,\n description: data.description || \"\",\n pubDate: data.pubDate,\n author: data.author || \"Val Town Team\",\n slug,\n content: markdownContent,\n });\n }\n\n return posts;\n}\n\n// Get a single blog post by slug\nexport async function getBlogPostBySlug(slug: string): Promise {\n const content = await readFile(`/posts/${slug}.md`, import.meta.url);\n const { data, content: markdownContent } = matter(content);\n\n return {\n title: data.title,\n link: `/blog/${slug}`,\n description: data.description || \"\",\n pubDate: data.pubDate,\n author: data.author || \"Val Town Team\",\n slug,\n content: markdownContent,\n };\n}",[],[129,176],"d8266e8a-13b2-11f0-a418-569c3dd06744","routes","dd331204-bb49-4352-b47a-f93404717d52",["D",1744031929960],[188,189,190,191],[183],{"_36":213,"_13":214,"_65":215,"_67":184,"_69":70,"_71":34,"_72":73,"_38":216,"_17":32,"_75":76,"_77":217,"_79":51,"_80":-5,"_111":218,"_18":219},{"_36":206,"_13":207,"_65":208,"_67":184,"_69":70,"_71":34,"_72":73,"_38":209,"_17":32,"_75":76,"_77":210,"_79":51,"_80":-5,"_111":211,"_18":212},{"_36":199,"_13":200,"_65":201,"_67":184,"_69":70,"_71":34,"_72":73,"_38":202,"_17":32,"_75":76,"_77":203,"_79":51,"_80":-5,"_111":204,"_18":205},{"_36":192,"_13":193,"_65":194,"_67":184,"_69":70,"_71":34,"_72":73,"_38":195,"_17":32,"_75":76,"_77":196,"_79":51,"_80":-5,"_111":197,"_18":198},"d8266d36-13b2-11f0-a418-569c3dd06744","rss.ts","a704db1c-2e68-45fe-b447-355c86a29d8f",["D",1744031929960],"import { Feed } from \"https://esm.sh/feed@4.2.2\";\nimport { Hono } from \"https://esm.sh/hono@3.12.0\";\nimport { posts } from \"../utils/posts.ts\";\n\nconst app = new Hono();\n\napp.get(\"/\", async (c) => {\n // Create a new feed instance\n const feed = new Feed({\n title: \"Val Town Blog\",\n description: \"The official blog for Val Town\",\n id: \"https://blog.val.town/\",\n link: \"https://blog.val.town/\",\n language: \"en\",\n favicon: \"https://blog.val.town/favicon.svg\",\n updated: new Date(posts[0].pubDate),\n feedLinks: {\n rss: \"https://blog.val.town/rss.xml\",\n },\n });\n\n // Add each post to the feed\n for (const post of posts) {\n feed.addItem({\n title: post.title,\n id: `https://blog.val.town${post.link}`,\n link: `https://blog.val.town${post.link}`,\n description: post.description,\n author: [\n {\n name: post.author,\n },\n ],\n date: new Date(post.pubDate),\n });\n }\n\n // Return the RSS feed\n return new Response(feed.rss2(), {\n headers: {\n \"Content-Type\": \"application/xml; charset=utf-8\",\n },\n });\n});\n\nexport default app;",[],[183,193],"d8266c00-13b2-11f0-a418-569c3dd06744","proxy.ts","89e5428c-f8f4-4bc6-82d7-eccf63a4d1c6",["D",1744031929960],"import { Hono } from \"https://esm.sh/hono@3.12.0\";\n\nconst app = new Hono();\n\nconst OLD_BLOG_URL = \"https://val-town-blog.pages.dev/\";\n\nexport async function proxyHonoRequest(c: any) {\n const url = new URL(c.req.url);\n\n // Proxy the request to the old blog\n const response = await fetch(\n new Request(OLD_BLOG_URL + url.pathname + url.search, {\n method: c.req.method,\n headers: c.req.raw.headers,\n }),\n );\n\n // Create a new response with the same status, headers, and body\n const newResponse = new Response(response.body, {\n status: response.status,\n statusText: response.statusText,\n headers: response.headers,\n });\n return newResponse;\n}\n\n// Fallback proxy route - handles all other requests\napp.all(\"*\", proxyHonoRequest);\n\nexport default app;",[],[183,200],"d8266ac0-13b2-11f0-a418-569c3dd06744","home.ts","9f310a40-6c73-4c55-a9d7-2efb7d620407",["D",1744031929960],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Hono } from \"https://esm.sh/hono@3.12.0\";\nimport { renderToString } from \"https://esm.sh/react-dom@18.2.0/server\";\nimport { HomePage } from \"../components/HomePage.tsx\";\nimport { posts } from \"../utils/posts.ts\";\n\nconst app = new Hono();\n\napp.get(\"/\", async (c) => {\n const html = renderToString();\n return c.html(html);\n});\n\nexport default app;",[],[183,207],"d82669bc-13b2-11f0-a418-569c3dd06744","blog.ts","36806ba7-275e-431d-a0b2-7ba5c3e88a2a",["D",1744031929960],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Hono } from \"https://esm.sh/hono@3.12.0\";\nimport { renderToString } from \"https://esm.sh/react-dom@18.2.0/server\";\nimport { BlogPostComponent } from \"../components/BlogPost.tsx\";\nimport { getBlogPostBySlug } from \"../utils/get-new-posts.ts\";\nimport { processMarkdown } from \"../utils/render-markdown.ts\";\nimport { proxyHonoRequest } from \"./proxy.ts\";\n\nconst app = new Hono();\n\n// Handle blog post routes\napp.get(\"/:slug\", async (c) => {\n const slug = c.req.param(\"slug\");\n\n let post;\n try {\n // Try to get the blog post\n post = await getBlogPostBySlug(slug);\n } catch (e) {\n return proxyHonoRequest(c);\n }\n\n // Process the markdown content\n const processedContent = await processMarkdown(post.content);\n\n // Render the blog post\n const html = renderToString(\n ,\n );\n\n return c.html(html);\n});\n\nexport default app;",[],[183,214],"d8266836-13b2-11f0-a418-569c3dd06744","posts","8b5c74a0-ce34-4d94-97ea-0aa6a6cab1b4",["D",1744031929960],[226,227],[221],{"_36":235,"_13":236,"_65":237,"_67":222,"_69":70,"_71":34,"_72":73,"_38":238,"_17":32,"_75":24,"_77":239,"_79":51,"_80":-5,"_111":240,"_18":241},{"_36":228,"_13":229,"_65":230,"_67":222,"_69":70,"_71":34,"_72":73,"_38":231,"_17":32,"_75":24,"_77":232,"_79":51,"_80":-5,"_111":233,"_18":234},"d82661f6-13b2-11f0-a418-569c3dd06744","vt-blog.md","7a85644e-f5a2-4a61-94f6-72466c12a1ca",["D",1744031929960],"---\ntitle: Migrating the Val Town Blog to Val Town\ndescription: How we migrated the Val Town Blog from Astro & Cloudflare Pages to be hosted directly on Val Town in a day\npubDate: 2025-04-02T00:00:00.000Z\nauthor: Steve Krouse\n---\n\nToday I migrated the Val Town Blog from Astro and Cloudflare Pages to be hosted directly on Val Town.\nWith some cleverness and a bit of vibe coding, I was able to start and complete this migration in a day.\n\n## The Old Architecture\n\nPreviously, our blog was:\n\n- Built with Astro, a modern static site generator\n- Deployed to Cloudflare Pages\n- Updated through a GitHub workflow\n\nWhile this setup worked well, we wanted:\n\n1. A browser-based editor\n2. Instant deploys (on feature branches and production)\n3. To dogfood\n\n## The New Architecture\n\nThe new blog:\n\n1. Hosts new blog posts directly on Val Town as markdown files\n2. Proxies requests for old blog posts to the original Cloudflare Pages deployment\n3. Generates the full lists of posts (for the homepage) by splicing together the new posts and the old posts, which it gets via the old blog's RSS feed\n\n### Technical Implementation\n\nWe implemented the new blog system using:\n\n- React for rendering components\n- Tailwind CSS for styling\n- Unified/Remark/Rehype for markdown processing\n- RSS Parser for fetching posts from the old blog\n\n#### Rendering old posts\n\nProxying is as easy as:\n\n```ts\nconst OLD_BLOG_URL = \"https://val-town-blog.pages.dev/\";\nconst response = await fetch(\n new Request(OLD_BLOG_URL + url.pathname + url.search, {\n method: request.method,\n headers: new Headers({ ...Object.fromEntries(request.headers) }),\n }),\n);\n```\n\n#### Fetching old posts\n\nWe fetch old posts via the `https://val-town-blog.pages.dev/rss.xml`,\nand combine them with the locally-hosted posts. We cache them both in-memory\non server startup.\n\n```ts\n// Example of how we fetch blog posts\nasync function getAllBlogPosts() {\n // Get local posts from markdown files\n const localPosts = await getLocalBlogPosts();\n \n // Get posts from RSS feed\n const rssPosts = await getRssBlogPosts();\n \n // Merge and sort by date\n return [...localPosts, ...rssPosts].sort((a, b) => {\n return new Date(b.pubDate).getTime() - new Date(a.pubDate).getTime();\n });\n}\n```\n\n## Conclusion\n\nSo far we've had reasonable success with this technique of migrating to Val Town quickly by proxying most old content, \nand only rebuilding the homepage. I first used this technique on my personal website, [stevekrouse.com](https://stevekrouse.com),\nand was pleased to see it continue to work here. If you, dear reader, have a blog you'd like to migrate to Val Town in this way\nand get stuck, shoot me an email at steve@val.town – I'd be happy to help.",[],[221,229],"d8265f58-13b2-11f0-a418-569c3dd06744","EXAMPLE.md","35eae793-019d-4691-9ef3-9917d222e33d",["D",1744031929960],"---\ntitle: Sample Val Town Blog Post\ndescription: This is a sample blog post that demonstrates how to create content for the Val Town Blog.\npubDate: 2025-03-29T00:00:00.000Z\nauthor: Val Town Team\n---\n\nThis is a sample blog post that demonstrates how to create content for the Val Town Blog.\n\nTo add a new post to the Val Town Blog:\n\n1. Create a markdown file in the `/blog-posts` directory\n2. Add YAML frontmatter with title, description, pubDate, and author\n3. The post will automatically appear on the homepage\n\n## Markdown Support\n\nThe blog supports GitHub Flavored Markdown features:\n\n### Code Blocks with Syntax Highlighting\n\n```typescript\nfunction hello() {\n console.log(\"Hello, Val Town!\");\n}\n```\n\n### Tables\n\n| Feature | Supported |\n|---------|-----------|\n| Tables | ✅ |\n| Lists | ✅ |\n| Code | ✅ |\n\n### Lists\n\n- Item 1\n- Item 2\n- Item 3\n\n### Images\n\nImages can be included using markdown syntax.\n\n## Conclusion\n\nThis is just a sample post. The blog system automatically processes markdown files and displays them on the homepage.",[],[221,236],["D",1744031929960],[245,246,247],[19],{"_36":88,"_13":89,"_65":90,"_67":68,"_69":70,"_71":34,"_72":73,"_38":254,"_17":32,"_75":76,"_77":92,"_79":51,"_80":-5,"_111":255,"_18":256},{"_36":82,"_13":83,"_65":84,"_67":68,"_69":70,"_71":34,"_72":73,"_38":251,"_17":32,"_75":76,"_77":86,"_79":51,"_80":-5,"_111":252,"_18":253},{"_36":63,"_13":64,"_65":66,"_67":68,"_69":70,"_71":34,"_72":73,"_38":248,"_17":32,"_75":76,"_77":78,"_79":51,"_80":-5,"_111":249,"_18":250},["D",1744031929960],[],[19,64],["D",1744031929960],[],[19,83],["D",1744031929960],[],[19,89],"d821b71e-13b2-11f0-a418-569c3dd06744",["D",1744031929960],"legacyEnvVars","httpPrivacy","description","imageUrl","userId","387c2a1a-af32-4662-ba80-cb97133b520c","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","a64c2ee7-6cd7-4fb7-9ff6-03782ed89739","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_300":296},"org",{"_11":12,"_294":-5,"_295":296,"_263":264,"_297":298,"_299":51},"branch",{"_17":34,"_13":16,"_36":70,"_42":257,"_45":37,"_46":290,"_291":53,"_292":43,"_293":57,"_58":14,"_54":12},193,"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJzR3VCb2xOR0loZEIwRWg5cnlVZUt4ajlpQiJ9","tier","pro","canRestrictVals","profileImageUrl","adoptOrgId",{"_36":257,"_13":14,"_38":409,"_49":-5,"_259":51,"_52":53,"_260":53,"_261":-5,"_262":-5,"_263":264,"_265":107,"_266":73,"_267":-5,"_268":-5,"_269":34,"_56":270,"_271":-5,"_272":-5,"_273":-5,"_274":-5,"_275":276,"_277":276,"_278":279,"_280":279,"_281":279,"_282":276,"_283":276,"_284":410,"_286":411,"_288":412,"_50":51},[343,347,350,355,362,363,364],"files",[343,344,345,346,347,348,349,350,351,352,353,354,355,356,357,358,359,360,361,362,363,364],"counts",{"_334":32,"_335":34,"_336":32,"_35":337,"_338":339},[328,329,330],{"_36":94,"_13":19,"_65":68,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":95,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_18":327},"upstreamProject",{"_36":43,"_13":59,"_261":324,"_262":-5,"_52":53,"_284":325},"upstreamBranch",{"_36":37,"_38":322,"_40":323,"_13":16,"_42":43,"_17":44,"_45":-5,"_46":-5,"_47":48,"_49":-5,"_50":51,"_52":53,"_54":55,"_56":57,"_58":59},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1743601009671],["D",1786979631389],"Val Town Blog, hosted on Val Town",{"_11":55,"_300":326},"https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg",[19],{"_36":88,"_13":89,"_65":90,"_67":68,"_69":70,"_71":34,"_72":73,"_38":91,"_17":32,"_75":76,"_77":92,"_79":51,"_80":-5,"_18":333},{"_36":82,"_13":83,"_65":84,"_67":68,"_69":70,"_71":34,"_72":73,"_38":85,"_17":32,"_75":76,"_77":86,"_79":51,"_80":-5,"_18":332},{"_36":63,"_13":64,"_65":66,"_67":68,"_69":70,"_71":34,"_72":73,"_38":74,"_17":32,"_75":76,"_77":78,"_79":51,"_80":-5,"_18":331},[19,64],[19,83],[19,89],"pulls","branches","forks",{"_340":32,"_342":32},"connections",{"_340":32,"_341":32},"count","unfilledCount","emptyCount",{"_36":94,"_13":19,"_65":68,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":242,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_111":407,"_18":408},{"_36":88,"_13":89,"_65":90,"_67":68,"_69":70,"_71":34,"_72":73,"_38":254,"_17":32,"_75":76,"_77":92,"_79":51,"_80":-5,"_111":405,"_18":406},{"_36":82,"_13":83,"_65":84,"_67":68,"_69":70,"_71":34,"_72":73,"_38":251,"_17":32,"_75":76,"_77":86,"_79":51,"_80":-5,"_111":403,"_18":404},{"_36":63,"_13":64,"_65":66,"_67":68,"_69":70,"_71":34,"_72":73,"_38":248,"_17":32,"_75":76,"_77":78,"_79":51,"_80":-5,"_111":401,"_18":402},{"_36":220,"_13":221,"_65":222,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":223,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_111":399,"_18":400},{"_36":235,"_13":236,"_65":237,"_67":222,"_69":70,"_71":34,"_72":73,"_38":238,"_17":32,"_75":24,"_77":239,"_79":51,"_80":-5,"_111":397,"_18":398},{"_36":228,"_13":229,"_65":230,"_67":222,"_69":70,"_71":34,"_72":73,"_38":231,"_17":32,"_75":24,"_77":232,"_79":51,"_80":-5,"_111":395,"_18":396},{"_36":182,"_13":183,"_65":184,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":185,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_111":393,"_18":394},{"_36":213,"_13":214,"_65":215,"_67":184,"_69":70,"_71":34,"_72":73,"_38":216,"_17":32,"_75":76,"_77":217,"_79":51,"_80":-5,"_111":391,"_18":392},{"_36":206,"_13":207,"_65":208,"_67":184,"_69":70,"_71":34,"_72":73,"_38":209,"_17":32,"_75":76,"_77":210,"_79":51,"_80":-5,"_111":389,"_18":390},{"_36":199,"_13":200,"_65":201,"_67":184,"_69":70,"_71":34,"_72":73,"_38":202,"_17":32,"_75":76,"_77":203,"_79":51,"_80":-5,"_111":387,"_18":388},{"_36":192,"_13":193,"_65":194,"_67":184,"_69":70,"_71":34,"_72":73,"_38":195,"_17":32,"_75":76,"_77":196,"_79":51,"_80":-5,"_111":385,"_18":386},{"_36":128,"_13":129,"_65":130,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":131,"_17":32,"_75":96,"_77":-5,"_79":51,"_80":-5,"_111":383,"_18":384},{"_36":175,"_13":176,"_65":177,"_67":130,"_69":70,"_71":34,"_72":73,"_38":178,"_17":32,"_75":76,"_77":179,"_79":51,"_80":-5,"_111":381,"_18":382},{"_36":168,"_13":169,"_65":170,"_67":130,"_69":70,"_71":34,"_72":73,"_38":171,"_17":32,"_75":76,"_77":172,"_79":51,"_80":-5,"_111":379,"_18":380},{"_36":161,"_13":162,"_65":163,"_67":130,"_69":70,"_71":34,"_72":73,"_38":164,"_17":32,"_75":76,"_77":165,"_79":51,"_80":-5,"_111":377,"_18":378},{"_36":154,"_13":155,"_65":156,"_67":130,"_69":70,"_71":34,"_72":73,"_38":157,"_17":32,"_75":76,"_77":158,"_79":51,"_80":-5,"_111":375,"_18":376},{"_36":147,"_13":148,"_65":149,"_67":130,"_69":70,"_71":34,"_72":73,"_38":150,"_17":32,"_75":76,"_77":151,"_79":51,"_80":-5,"_111":373,"_18":374},{"_36":140,"_13":141,"_65":142,"_67":130,"_69":70,"_71":34,"_72":73,"_38":143,"_17":32,"_75":76,"_77":144,"_79":51,"_80":-5,"_111":371,"_18":372},{"_36":121,"_13":122,"_65":123,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":124,"_17":32,"_75":24,"_77":125,"_79":51,"_80":-5,"_111":369,"_18":370},{"_36":114,"_13":115,"_65":116,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":117,"_17":32,"_75":24,"_77":118,"_79":51,"_80":-5,"_111":367,"_18":368},{"_36":105,"_13":106,"_65":107,"_67":-5,"_69":70,"_71":34,"_72":73,"_38":108,"_17":32,"_75":109,"_77":110,"_79":51,"_80":-5,"_111":365,"_18":366},[],[106],[],[115],[],[122],[],[129,141],[],[129,148],[],[129,155],[],[129,162],[],[129,169],[],[129,176],[356,357,358,359,360,361],[129],[],[183,193],[],[183,200],[],[183,207],[],[183,214],[351,352,353,354],[183],[],[221,229],[],[221,236],[348,349],[221],[],[19,64],[],[19,83],[],[19,89],[344,345,346],[19],["D",1744031929960],{"_11":12,"_300":296},{"_11":12,"_294":-5,"_295":296,"_263":264,"_297":298,"_299":51},{"_17":34,"_13":16,"_36":70,"_42":257,"_45":37,"_46":290,"_291":53,"_292":43,"_293":57,"_58":14,"_54":12},"ctx",{"_284":-5,"_319":446,"_447":448,"_449":450,"_451":51,"_452":51,"_453":51,"_454":73,"_455":-5,"_456":-7,"_457":-7,"_458":32,"_459":51,"_460":51,"_461":-5,"_462":51,"_463":51,"_464":51,"_465":-5},"ENV",{"_417":418,"_419":420,"_421":16,"_422":423,"_424":425,"_426":427,"_428":429,"_430":431,"_432":433,"_434":435,"_436":437,"_438":439,"_440":441,"_442":443,"_444":445},"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"]