Public
markdownBlogStarter
Viewing readonly version: 147View latest version
HTTP
99
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
/** @jsxImportSource https://esm.sh/react@18.2.0 */
import Markdown from "https://esm.sh/react-markdown@9?deps=react@18.2.0";
import { getProjectFiles, readFile } from "https://esm.town/v/stevekrouse/utils@195-main/serve-public/index.ts";
import { renderToString } from "npm:react-dom@18.2.0/server";
import { Layout } from "./Layout.tsx";
function PostComponent({ markdown, link }: { markdown: string; link: string }) {
return (
<div style={{ border: "1px solid black" }}>
<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 getProjectFiles(import.meta.url);
// const posts = files.filter((file) => file.path.startsWith("posts/")); TODO: do this when we fix paths
const posts = files.filter((file) => file.path.endsWith(".md") && file.path !== "README.md");
const postContents = await Promise.all(
posts.map(async (file) => await readFile("/posts/" + file.name, import.meta.url)), // TODO use file.path when we fix them
);
return html(
<div>
<h1>My blog!</h1>
<p>This is my blog.</p>
<h2>Posts</h2>
{postContents.map((markdown, i) => <PostComponent markdown={markdown} link={posts[i].name} />)}
</div>,
);
}
if (url.pathname.startsWith("/posts/")) {
const markdown = await readFile(url.pathname, import.meta.url);
H
index.tsx