andrewBlogs

connnolly andrewBlogs

Remix of alexwein/alexBlogs

Public

History for index.tsx

v6
3/10/2025
View
⦚ 34 unchanged lines ⦚
<div>
<Header />
~~<h1>Alex Wein has some thoughts</h1>~~
{postContents.map((markdown, i) => <PostComponent markdown={markdown} link={posts[i].name} />)}
<a href="https://www.val.town/x/alexwein/alexBlogs">View source</a>
⦚ 39 unchanged lines ⦚
⦚ 34 unchanged lines ⦚
<div>
<Header />
<h1>Andrew has a blog</h1>
{postContents.map((markdown, i) => <PostComponent markdown={markdown} link={posts[i].name} />)}
<a href="https://www.val.town/x/alexwein/alexBlogs">View source</a>
⦚ 39 unchanged lines ⦚
v1
3/10/2025
View

/** @jsxImportSource https://esm.sh/react@18.2.0 */
import Markdown from "https://esm.sh/react-markdown@9?deps=react@18.2.0";
import { listFiles, readFile } from "https://esm.town/v/std/utils@64-main/index.ts";
import { renderToString } from "npm:react-dom@18.2.0/server";
import { Layout } from "./Layout.tsx";

function Header() {
return (
<header style={{ marginBottom: "20px", padding: "10px", borderBottom: "1px solid gray" }}>
<a href="/" style={{ marginRight: "20px" }}>Home</a>
<a href="/about">About</a>
</header>
);
}

function PostComponent({ markdown, link }: { markdown: string; link?: string }) {
return (
<div style={{ border: "1px solid gray", padding: "10px", marginBottom: "20px", borderRadius: "5px" }}>
<a href={`/posts/${link}`}>{link}</a>
<Markdown>{markdown}</Markdown>
</div>
);
}

export default async function(req: Request): Promise<Response> {
const url = new URL(req.url);
if (url.pathname === "/") {
const files = await listFiles(import.meta.url);
const posts = files.filter((file) => file.path.startsWith("posts/"));
const postContents = await Promise.all(
posts.map(async (file) => await (await fetch(file.links.module)).text()),
);

return html(
<div>
<Header />