diary

ブログをはじめました

Astro + Markdown で個人ブログをセットアップした記録

はじめに#

このブログは Astro で構築し、記事はリポジトリ内の Markdown ファイルで管理しています。Cloudflare Pages にデプロイし、Git に push するだけで公開されます。

採用した構成#

  • SSG: Astro (Content Collections + glob loader)
  • スタイル: Tailwind CSS v4 + @tailwindcss/typography
  • シンタックスハイライト: Shiki (github-dark)
  • 検索: Pagefind (ビルド時にインデックス生成)
  • RSS / Sitemap / OGP: それぞれ標準 integration を利用

なぜ Astro なのか#

Markdown ファイルからのビルドが速く、デフォルトで JS 配信が最小限なので、技術記事ブログ には十分すぎる体験を提供できるためです。

静的に出せるものは静的に。

サンプルコード#

import { defineCollection, z } from 'astro:content';

const posts = defineCollection({
  schema: z.object({
    title: z.string(),
    pubDate: z.coerce.date(),
    tags: z.array(z.string()).default([]),
  }),
});

次にやること#

  1. デザイン調整
  2. OGP 画像生成
  3. 独自ドメイン接続