\n {/* Header section */}\n

{title}

\n {description &&

{description}

}\n

\n {author && {author}}\n {date && author && •}\n {date && {date}}\n

\n {tags.length > 0 && (\n

\n {tags.map((tag, i) => (\n \n {tag}\n \n ))}\n

\n )}\n

\n \n {/* Main content */}\n

\n \n {/* Footer with source link */}\n \n

\n );\n}\n\n// Main route handler\napp.get('/', async (c) => {\n try {\n // Load the moi.md file content\n const moiContent = await fetch(new URL('./moi.md', import.meta.url).toString())\n .then(res => res.text())\n .catch(() => {\n console.error('Error loading moi.md');\n return '';\n });\n \n // Parse the markdown with frontmatter\n const { frontmatter, content } = parseMarkdownWithFrontmatter(moiContent);\n \n // Render the blog post component to string\n const postHtml = renderToString();\n \n // Prepare the full HTML with appropriate styles\n const html = `\n \n \n \n \n \n ${frontmatter.title || 'Markdown Blog'}\n \n \n \n \n \n \n \n \n ${postHtml}\n \n \n `;\n \n return c.html(html);\n } catch (error) {\n console.error('Error rendering blog:', error);\n return c.text('Error rendering blog post', 500);\n }\n});\n\n// Error handler to show full errors\napp.onError((err, c) => {\n console.error('Application error:', err);\n throw err; // Re-throw to see full stack trace\n});\n\nexport default app.fetch;",[],[166],{"_102":173,"_95":174,"_147":175,"_149":-5,"_150":134,"_151":133,"_153":116,"_104":176,"_99":177,"_155":156,"_157":178,"_159":27,"_160":-5,"_161":179,"_98":180},"8e46ad32-22c3-11f0-b7e8-569c3dd06744","moi.md","b8945448-8fea-4289-a13b-b5195edfdeda",["D",1745688374935],8,"---\ntitle: \"Introducing build.moi\"\ndescription: \"Showcase your Val Town projects in a clean, modern grid.\"\nauthor: \"dcm31\"\ndate: \"2025-04-26\"\nurl: \"https://dcm31--2909c212671748f58fd383de8d4ca700.web.val.run\"\nimageUrl: \"https://chatgpt.com/backend-api/public_content/enc/eyJpZCI6Im1fNjgwZDE1N2JkZTQ0ODE5MThhZGE3NTNkZDI4NTI4NGQ6ZmlsZV8wMDAwMDAwMDVkZDQ2MWY2ODNjZGE4Y2Q1YzBlMDc3NSIsInRzIjoiNDg0OTEzIiwicCI6InB5aSIsInNpZyI6IjBhMGVlMjJiZGNmNDFjMTZiZThiNTNkOGMxY2Y1NWEyNTYwMDYyMjY0YzQ0MjM3Y2NlNmNkNjNjYzRiNzgyNGIiLCJ2IjoiMCIsImdpem1vX2lkIjpudWxsfQ==\"\ntags: [\"val-town\", \"showcase\", \"grid\", \"template\"]\n---\n\n# Introducing build.moi\n\n**build.moi** is a showcase platform for Val Town users, displaying their vals in a clean, modern grid layout.\n\n## Features\n\n- **View user profiles** in a beautiful, responsive gallery\n- **Posts and Code tabs**: Filter between showcased apps (Posts) and all vals (Code)\n- **Live app links**: Posts link directly to HTTP endpoints or custom URLs\n- **Portrait 2:3 cards** for a sleek, mobile-friendly look\n- **Edge-to-edge grid** with minimal spacing\n- **Automatic dark mode** that follows system preferences\n- **Circle-cropped profile pictures** and **muted colorful placeholders** for missing images\n- **Smooth hover effects** showing val details\n- **Dynamic grid**: 3-5 columns depending on screen size\n- **Client-side routing** with paths like `/@username`\n- **Custom profile configuration** via simple `moi.md` files\n\n## How to Use It\n\n1. Visit [build.moi](https://dcm31--2909c212671748f58fd383de8d4ca700.web.val.run)\n2. Enter any Val Town username to see their profile.\n3. Or directly navigate to `/@username`!\n\nThe **Posts** tab highlights apps with a `moi.md` file. \nThe **Code** tab shows all vals, linking directly to Val Town code.\n\n## Customizing Your Posts\n\nYou can customize how your apps show up by adding a `moi.md` file at the root of your val project.\n\nExample:\n\n```yaml\n---\ntitle: \"My Awesome Val Town Project\"\ndescription: \"A detailed description of my project\"\nimageUrl: \"https://example.com/my-custom-image.jpg\"\nurl: \"https://my-live-app-endpoint.web.val.run\"\nauthor: \"yourusername\"\ntags: [\"javascript\", \"react\", \"val-town\"]\n---",[],[174],"files",[144,164,172],"counts",{"_185":31,"_186":152,"_187":31,"_188":31},"pulls","branches","forks","envVars","contents",[191,194,197],{"_102":145,"_95":146,"_147":148,"_149":-5,"_150":134,"_151":152,"_153":116,"_104":192,"_99":31,"_155":156,"_157":158,"_159":27,"_160":-5,"_98":193},["D",1745687432948],[146],{"_102":165,"_95":166,"_147":114,"_149":-5,"_150":134,"_151":152,"_153":116,"_104":195,"_99":31,"_155":168,"_157":169,"_159":27,"_160":-5,"_98":196},["D",1745687432948],[166],{"_102":173,"_95":174,"_147":175,"_149":-5,"_150":134,"_151":133,"_153":116,"_104":198,"_99":177,"_155":156,"_157":178,"_159":27,"_160":-5,"_98":199},["D",1745688374935],[174],"upstream",{"_102":202,"_95":203,"_110":204,"_111":-5,"_108":109,"_21":205},"8f5e24be-22b6-11f0-96dd-569c3dd06744","simple_moirkdown_blog","Simple markdown blog template with moi.md integration",{"_93":94,"_129":130},"emptyEnvVars","isNew","routes/_app.x.$handle.$name.branch.$branch.history",{"_93":94,"_95":96,"_97":41,"_100":210,"_214":215,"_284":31,"_285":27},{"_102":103,"_95":96,"_104":211,"_106":-5,"_107":27,"_108":109,"_110":-5,"_111":-5,"_12":112,"_113":114,"_115":116,"_117":-5,"_118":31,"_119":120,"_121":120,"_122":123,"_124":123,"_125":123,"_126":120,"_127":27,"_21":212,"_131":213},["D",1745687432948],{"_93":94,"_129":130},{"_99":133,"_95":41,"_102":134,"_135":103,"_136":137,"_138":139,"_140":109,"_141":112},"history",[216,221,229,236,243,251,258,265,271],{"_147":175,"_99":133,"_104":217,"_150":134,"_181":218},["D",1745688374935],[219],{"_102":173,"_150":134,"_147":175,"_95":174,"_157":178,"_155":156,"_99":177,"_149":-5,"_104":217,"_151":133,"_160":-5,"_153":116,"_159":27,"_98":220},[174],{"_147":175,"_99":177,"_104":222,"_150":134,"_181":223},["D",1745688147210],[224],{"_102":225,"_150":134,"_147":175,"_95":174,"_157":226,"_155":156,"_99":227,"_149":-5,"_104":222,"_151":177,"_160":-5,"_153":27,"_159":27,"_98":228},"068aa9b6-22c3-11f0-b7c8-569c3dd06744","---\ntitle: \"Introducing build.moi\"\ndescription: \"Showcase your Val Town projects in a clean, modern grid.\"\nauthor: \"dcm31\"\ndate: \"2025-04-26\"\nurl: \"https://dcm31--2909c212671748f58fd383de8d4ca700.web.val.run\"\nimageUrl: \"https://chatgpt.com/backend-api/public_content/enc/eyJpZCI6Im1fNjgwZDE1N2JkZTQ0ODE5MThhZGE3NTNkZDI4NTI4NGQ6ZmlsZV8wMDAwMDAwMDVkZDQ2MWY2ODNjZGE4Y2Q1YzBlMDc3NSIsInRzIjoiNDg0OTEzIiwicCI6InB5aSIsInNpZyI6IjBhMGVlMjJiZGNmNDFjMTZiZThiNTNkOGMxY2Y1NWEyNTYwMDYyMjY0YzQ0MjM3Y2NlNmNkNjNjYzRiNzgyNGIiLCJ2IjoiMCIsImdpem1vX2lkIjpudWxsfQ==\ntags: [\"val-town\", \"showcase\", \"grid\", \"template\"]\n---\n\n# Introducing build.moi\n\n**build.moi** is a showcase platform for Val Town users, displaying their vals in a clean, modern grid layout.\n\n## Features\n\n- **View user profiles** in a beautiful, responsive gallery\n- **Posts and Code tabs**: Filter between showcased apps (Posts) and all vals (Code)\n- **Live app links**: Posts link directly to HTTP endpoints or custom URLs\n- **Portrait 2:3 cards** for a sleek, mobile-friendly look\n- **Edge-to-edge grid** with minimal spacing\n- **Automatic dark mode** that follows system preferences\n- **Circle-cropped profile pictures** and **muted colorful placeholders** for missing images\n- **Smooth hover effects** showing val details\n- **Dynamic grid**: 3-5 columns depending on screen size\n- **Client-side routing** with paths like `/@username`\n- **Custom profile configuration** via simple `moi.md` files\n\n## How to Use It\n\n1. Visit [build.moi](https://dcm31--2909c212671748f58fd383de8d4ca700.web.val.run)\n2. Enter any Val Town username to see their profile.\n3. Or directly navigate to `/@username`!\n\nThe **Posts** tab highlights apps with a `moi.md` file. \nThe **Code** tab shows all vals, linking directly to Val Town code.\n\n## Customizing Your Posts\n\nYou can customize how your apps show up by adding a `moi.md` file at the root of your val project.\n\nExample:\n\n```yaml\n---\ntitle: \"My Awesome Val Town Project\"\ndescription: \"A detailed description of my project\"\nimageUrl: \"https://example.com/my-custom-image.jpg\"\nurl: \"https://my-live-app-endpoint.web.val.run\"\nauthor: \"yourusername\"\ntags: [\"javascript\", \"react\", \"val-town\"]\n---",7,[174],{"_147":175,"_99":227,"_104":230,"_150":134,"_181":231},["D",1745688105821],[232],{"_102":233,"_150":134,"_147":175,"_95":174,"_157":234,"_155":156,"_99":139,"_149":-5,"_104":230,"_151":227,"_160":-5,"_153":27,"_159":27,"_98":235},"eddf0a10-22c2-11f0-933e-569c3dd06744","---\ntitle: \"Introducing build.moi\"\ndescription: \"Showcase your Val Town projects in a clean, modern grid.\"\nauthor: \"dcm31\"\ndate: \"2025-04-26\"\nurl: \"https://dcm31--2909c212671748f58fd383de8d4ca700.web.val.run\"\nimageUrl: \"https://chatgpt.com/backend-api/public_content/enc/eyJpZCI6Im1fNjgwZDBjYzQxYTcwODE5MWFlZTZmNzhjZmJjNGVhNGQ6ZmlsZV8wMDAwMDAwMDU0MTg2MWY2YTRiOWMxOWE3NTA4Yjk5NCIsInRzIjoiNDg0OTEyIiwicCI6InB5aSIsInNpZyI6IjFhODc1NDE1ZjJkNmNlM2EwYjY4YjMzYmZhYTIwMDM2YmIzMWI5NjU2YWYzZTdkYmM2N2IxOWRmMzdlZjliYzIiLCJ2IjoiMCIsImdpem1vX2lkIjpudWxsfQ==\"\ntags: [\"val-town\", \"showcase\", \"grid\", \"template\"]\n---\n\n# Introducing build.moi\n\n**build.moi** is a showcase platform for Val Town users, displaying their vals in a clean, modern grid layout.\n\n## Features\n\n- **View user profiles** in a beautiful, responsive gallery\n- **Posts and Code tabs**: Filter between showcased apps (Posts) and all vals (Code)\n- **Live app links**: Posts link directly to HTTP endpoints or custom URLs\n- **Portrait 2:3 cards** for a sleek, mobile-friendly look\n- **Edge-to-edge grid** with minimal spacing\n- **Automatic dark mode** that follows system preferences\n- **Circle-cropped profile pictures** and **muted colorful placeholders** for missing images\n- **Smooth hover effects** showing val details\n- **Dynamic grid**: 3-5 columns depending on screen size\n- **Client-side routing** with paths like `/@username`\n- **Custom profile configuration** via simple `moi.md` files\n\n## How to Use It\n\n1. Visit [build.moi](https://dcm31--2909c212671748f58fd383de8d4ca700.web.val.run)\n2. Enter any Val Town username to see their profile.\n3. Or directly navigate to `/@username`!\n\nThe **Posts** tab highlights apps with a `moi.md` file. \nThe **Code** tab shows all vals, linking directly to Val Town code.\n\n## Customizing Your Posts\n\nYou can customize how your apps show up by adding a `moi.md` file at the root of your val project.\n\nExample:\n\n```yaml\n---\ntitle: \"My Awesome Val Town Project\"\ndescription: \"A detailed description of my project\"\nimageUrl: \"https://example.com/my-custom-image.jpg\"\nurl: \"https://my-live-app-endpoint.web.val.run\"\nauthor: \"yourusername\"\ntags: [\"javascript\", \"react\", \"val-town\"]\n---",[174],{"_147":175,"_99":139,"_104":237,"_150":134,"_181":238},["D",1745688105214],[239],{"_102":240,"_150":134,"_147":175,"_95":174,"_157":234,"_155":156,"_99":241,"_149":-5,"_104":237,"_151":139,"_160":-5,"_153":27,"_159":27,"_98":242},"ed8249ba-22c2-11f0-ab6d-569c3dd06744",5,[174],{"_147":175,"_99":241,"_104":244,"_150":134,"_181":245},["D",1745688042629],[246],{"_102":247,"_150":134,"_147":175,"_95":174,"_157":248,"_155":156,"_99":249,"_149":-5,"_104":244,"_151":241,"_160":-5,"_153":27,"_159":27,"_98":250},"c834caca-22c2-11f0-ab6d-569c3dd06744","---\ntitle: \"Introducing build.moi\"\ndescription: \"Showcase your Val Town projects in a clean, modern grid.\"\nauthor: \"dcm31\"\ndate: \"2025-04-26\"\nurl: \"https://chatgpt.com/backend-api/public_content/enc/eyJpZCI6Im1fNjgwZDE1N2JkZTQ0ODE5MThhZGE3NTNkZDI4NTI4NGQ6ZmlsZV8wMDAwMDAwMDVkZDQ2MWY2ODNjZGE4Y2Q1YzBlMDc3NSIsInRzIjoiNDg0OTEzIiwicCI6InB5aSIsInNpZyI6IjBhMGVlMjJiZGNmNDFjMTZiZThiNTNkOGMxY2Y1NWEyNTYwMDYyMjY0YzQ0MjM3Y2NlNmNkNjNjYzRiNzgyNGIiLCJ2IjoiMCIsImdpem1vX2lkIjpudWxsfQ==\"\ntags: [\"val-town\", \"showcase\", \"grid\", \"template\"]\n---\n\n# Introducing build.moi\n\n**build.moi** is a showcase platform for Val Town users, displaying their vals in a clean, modern grid layout.\n\n## Features\n\n- **View user profiles** in a beautiful, responsive gallery\n- **Posts and Code tabs**: Filter between showcased apps (Posts) and all vals (Code)\n- **Live app links**: Posts link directly to HTTP endpoints or custom URLs\n- **Portrait 2:3 cards** for a sleek, mobile-friendly look\n- **Edge-to-edge grid** with minimal spacing\n- **Automatic dark mode** that follows system preferences\n- **Circle-cropped profile pictures** and **muted colorful placeholders** for missing images\n- **Smooth hover effects** showing val details\n- **Dynamic grid**: 3-5 columns depending on screen size\n- **Client-side routing** with paths like `/@username`\n- **Custom profile configuration** via simple `moi.md` files\n\n## How to Use It\n\n1. Visit [build.moi](https://dcm31--2909c212671748f58fd383de8d4ca700.web.val.run)\n2. Enter any Val Town username to see their profile.\n3. Or directly navigate to `/@username`!\n\nThe **Posts** tab highlights apps with a `moi.md` file. \nThe **Code** tab shows all vals, linking directly to Val Town code.\n\n## Customizing Your Posts\n\nYou can customize how your apps show up by adding a `moi.md` file at the root of your val project.\n\nExample:\n\n```yaml\n---\ntitle: \"My Awesome Val Town Project\"\ndescription: \"A detailed description of my project\"\nimageUrl: \"https://example.com/my-custom-image.jpg\"\nurl: \"https://my-live-app-endpoint.web.val.run\"\nauthor: \"yourusername\"\ntags: [\"javascript\", \"react\", \"val-town\"]\n---",4,[174],{"_147":175,"_99":249,"_104":252,"_150":134,"_181":253},["D",1745687996191],[254],{"_102":255,"_150":134,"_147":175,"_95":174,"_157":248,"_155":156,"_99":256,"_149":-5,"_104":252,"_151":249,"_160":-5,"_153":27,"_159":27,"_98":257},"ac870b94-22c2-11f0-b85f-569c3dd06744",3,[174],{"_147":175,"_99":256,"_104":259,"_150":134,"_181":260},["D",1745687720654],[261],{"_102":262,"_150":134,"_147":175,"_95":174,"_157":234,"_155":156,"_99":263,"_149":-5,"_104":259,"_151":256,"_160":-5,"_153":27,"_159":27,"_98":264},"084bb156-22c2-11f0-8f70-569c3dd06744",2,[174],{"_147":175,"_99":263,"_104":266,"_150":134,"_181":267},["D",1745687712636],[268],{"_102":269,"_150":134,"_147":175,"_95":174,"_157":234,"_155":156,"_99":152,"_149":-5,"_104":266,"_151":263,"_160":-5,"_153":27,"_159":27,"_98":270},"038434d6-22c2-11f0-8c8e-569c3dd06744",[174],{"_147":148,"_99":152,"_104":272,"_150":134,"_181":273},["D",1745687432948],[274,276,281],{"_102":145,"_150":134,"_147":148,"_95":146,"_157":158,"_155":156,"_99":31,"_149":-5,"_104":272,"_151":152,"_160":-5,"_153":116,"_159":27,"_98":275},[146],{"_102":277,"_150":134,"_147":175,"_95":174,"_157":278,"_155":156,"_99":31,"_149":-5,"_104":279,"_151":152,"_160":-5,"_153":27,"_159":27,"_98":280},"5cd476b4-22c1-11f0-bece-569c3dd06744","---\ntitle: \"My Simple MOIrkdown Blog\"\ndescription: \"A minimal markdown blog template for Val Town\"\nauthor: \"dcm31\"\ndate: \"2025-04-26\"\nurl: \"https://dcm31--45d1947422b711f0be5c569c3dd06744.web.val.run\"\nimageUrl: \"https://chatgpt.com/backend-api/public_content/enc/eyJpZCI6Im1fNjgwZDBjYzQxYTcwODE5MWFlZTZmNzhjZmJjNGVhNGQ6ZmlsZV8wMDAwMDAwMDU0MTg2MWY2YTRiOWMxOWE3NTA4Yjk5NCIsInRzIjoiNDg0OTEyIiwicCI6InB5aSIsInNpZyI6IjFhODc1NDE1ZjJkNmNlM2EwYjY4YjMzYmZhYTIwMDM2YmIzMWI5NjU2YWYzZTdkYmM2N2IxOWRmMzdlZjliYzIiLCJ2IjoiMCIsImdpem1vX2lkIjpudWxsfQ==\"\ntags: [\"markdown\", \"blog\", \"val-town\", \"template\"]\n---\n\n# Welcome to the Simple Markdown Blog Template\n\nThis minimal blog template allows you to create beautiful blog posts using just markdown in your moi.md file. It's designed to work seamlessly with the build.moi platform for Val Town.\n\n## How It Works\n\nThis blog automatically renders the content of your `moi.md` file. It supports all standard markdown features:\n\n- **Headings** (H1 through H6)\n- **Lists** (ordered and unordered)\n- **Emphasis** (bold, italic)\n- **Code blocks** (inline and fenced)\n- **Links** and **images**\n- **Tables**, **blockquotes**, and more\n\n## Features\n\nThe template includes several nice features:\n\n1. **Clean, minimalist design** focused on readability\n2. **Responsive layout** that looks great on any device\n3. **Automatic dark mode** that respects system preferences\n4. **Metadata display** for title, description, author, date, and tags\n5. **Syntax highlighting** for code blocks\n\n## YAML Frontmatter\n\nThe blog uses YAML frontmatter at the top of your moi.md file to configure your post. Here's what each field does:\n\n```yaml\n---\ntitle: \"Your Blog Post Title\"\ndescription: \"A brief description of your post\"\nauthor: \"Your Name\"\ndate: \"YYYY-MM-DD\"\nurl: \"Your live blog URL\" \nimageUrl: \"Cover image URL (2:3 ratio works best)\"\ntags: [\"tag1\", \"tag2\", \"tag3\"]\n---\n```\n\nThe `url` field is particularly important as it allows build.moi to link directly to your blog from the Posts tab.\n\n## Using This Template\n\nTo use this template for your own blog:\n\n1. Fork this project\n2. Edit the moi.md file with your content\n3. Deploy your blog on Val Town\n\n## Markdown Examples\n\nHere are a few more markdown examples to show the styling:\n\n### Code Blocks\n\n```javascript\nfunction greet(name) {\n return `Hello, ${name}!`;\n}\n\nconsole.log(greet('Val Town User'));\n```\n\n### Blockquotes\n\n> The best way to predict the future is to invent it.\n> \n> — Alan Kay\n\n### Tables\n\n| Feature | Supported |\n|---------|-----------|\n| Headings | ✅ |\n| Lists | ✅ |\n| Code blocks | ✅ |\n| Images | ✅ |\n| Tables | ✅ |\n\n### Images\n\nYou can include images using standard markdown syntax:\n\n![Example image](https://images.unsplash.com/photo-1519638399535-1b036603ac77?w=600&h=400&fit=crop)\n\n## Integration with build.moi\n\nThis template is designed to work perfectly with the build.moi platform. When your blog is displayed in the build.moi grid, it will:\n\n1. Show your cover image if you've provided one in the `imageUrl` field\n2. Link directly to your live blog instead of the code when viewed from the Posts tab\n3. Display a clean, formatted preview with your blog information\n\n## Next Steps\n\nFeel free to modify this template to suit your needs. You can customize the styling by editing the main.tsx file or change the structure of your blog post by altering the moi.md file.\n\nHappy blogging on Val Town!",["D",1745687432948],[174],{"_102":165,"_150":134,"_147":114,"_95":166,"_157":169,"_155":168,"_99":31,"_149":-5,"_104":282,"_151":152,"_160":-5,"_153":116,"_159":27,"_98":283},["D",1745687432948],[166],"page","hasNext","routes/_app","actionData","errors"]

History