このブログ、実はAstroのContent Collectionsで動いてる。
型安全で、Markdownで書けて、デザイン変更が一箇所で済む。ブログ記事管理システムを構築した時の実装メモを残しておく。
src/content/config.tsでZodを使ってスキーマを定義。
title、date、description、tags…必要なfrontmatter項目を全部ここで指定する。
これがあると、VSCodeで補完も効くし、タイポも防げる。
/tech/[slug].astroで記事ページを自動生成。
getStaticPathsでコレクション内の全記事を取得して、各記事ページを生成する。
新しい記事を追加しても、ルーティングの設定は不要。
Content Collectionsは小〜中規模のブログに最適。型安全でMarkdownで書けて、デザイン変更が一箇所で済む。セットアップも簡単だった。
Zodを使ってfrontmatterの型を定義。title、date、description、tags、heroImage…全部ここで。
/tech/[slug].astroで記事ページを自動生成。getStaticPathsでコレクション内の全記事を取得。
Geminiのアドバイスを採用し、デザインはPostLayout.astroに集約。変更が一箇所で済む。
Content Collectionsはブログ構築に最適。
型安全、Markdown対応、自動ルーティング、一元管理…必要なものが全部揃ってる。セットアップも公式ドキュメント見ながら1時間くらいで終わった。
このブログもContent Collectionsで動いてる。小〜中規模のブログにはおすすめ。
