1/** @jsxImportSource npm:react */
2import React from "npm:react";
3
4export default function ValTownLogo(props: React.SVGProps<SVGSVGElement>) {
5 return (
6 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 442 79" {...props}>
1/** @jsxImportSource https://esm.sh/react */
2import mermaid from "https://esm.sh/mermaid@10.6.1";
3import React, { useEffect, useRef, useState } from "https://esm.sh/react";
4import { createRoot } from "https://esm.sh/react-dom/client";
5
6// Initial diagram example
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React from "https://esm.sh/react@18.2.0";
3
4/**
35We implemented the new blog system using:
36
37- React for rendering components
38- Tailwind CSS for styling
39- Unified/Remark/Rehype for markdown processing
20
21- **`/index.tsx`**: Main entry point that handles routing and proxying
22- **`/components/`**: React components for rendering the blog
23 - **`Layout.tsx`**: Shared layout component with header and Tailwind setup
24 - **`HomePage.tsx`**: Renders the blog homepage with the list of posts
29### Technical Stack
30
31- **React**: For rendering components
32- **Tailwind CSS**: For styling (via CDN)
33- **Unified/Remark/Rehype**: For markdown processing with GitHub Flavored Markdown support
69When modifying the blog system:
70
711. Update the React components in the `/components` directory
722. Modify the blog post utilities in `/utils/blogPosts.ts`
733. Test changes by visiting the homepage and individual blog posts
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { Hono } from "https://esm.sh/hono@3.12.0";
3import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";
4import { HomePage } from "../components/HomePage.tsx";
5import { posts } from "../utils/posts.ts";
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { Hono } from "https://esm.sh/hono@3.12.0";
3import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";
4import { BlogPostComponent } from "../components/BlogPost.tsx";
5import { getBlogPostBySlug } from "../utils/get-new-posts.ts";
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { Hono } from "https://esm.sh/hono@3.12.0";
3import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";
4import { HomePage } from "../components/HomePage.tsx";
5import { posts } from "../utils/posts.ts";
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React from "https://esm.sh/react@18.2.0";
3
4interface LayoutProps {
5 title: string;
6 children: React.ReactNode;
7}
8
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { Hono } from "https://esm.sh/hono@3.12.0";
3import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";
4import { BlogPostComponent } from "../components/BlogPost.tsx";
5import { getBlogPostBySlug } from "../utils/get-new-posts.ts";