技術スタック紹介

以下の技術を使用しています

public 内のmdファイルに記事を書き、slugページで↓のように取得し表示しています

const Schema = v.object({
  date: v.date(),
  value: v.string(),
});

async function getPostBySlug(slug: string) {
  const filename = `./public/${slug}/index.md`;
  const { content, data } = matter(await readFile(filename, "utf8"));
  const file = await formatMarkdown(content);
  return v.parse(Schema, { content, ...file, ...data });
}

export default async function PostPage(props: {
  params: Promise<{ slug: string }>;
}) {
  const params = await props.params;
  const data = await getPostBySlug(params.slug);

  return (
    <ArticleLayout
      renderHeaderRight={() => {
        return (
          <Text className="font-semibold text-xs">
            {data.date.toDateString()}
          </Text>
        );
      }}
    >
      <Markdown>{data.value}</Markdown>
    </ArticleLayout>
  );
}

GitHub リポジトリ - ryujito.me