ブログをmicroCMSからMarkdownに移行した
3年半前にブログの構成を変えたときにmicroCMSを入れて、そこから見事に放置していたのですが、久しぶりに手を入れるついでに記事の管理をリポジトリの中に移しました。
変えたのはコンテンツの置き場所だけで、SSGはAstroのまま、配信もCloudflare Pagesのままです。
- CMS: microCMS → リポジトリ内のMarkdown
- 更新方法: 管理画面から入稿 → PRを作ってマージ
一番の理由は、記事を自分の手で書くよりも、Claudeにリポジトリを読ませて書かせたほうが楽だからです。
記事がリポジトリの中にあれば、構成もコードも既存の記事もまとめて読ませて、そのままMarkdownを書かせられます。出てきたものはPRの差分としてそのまま確認できるので、直したいところだけ直せばいい。
CMSの管理画面が間に入ると、このステップが途端に面倒になります。
Astroのコンテンツコレクション
記事は src/content/posts/ にMarkdownで置いて、Astroのコンテンツコレクションから読んでいます。
frontmatterはこんな感じ。
---
title: "記事のタイトル"
description: "一覧とmeta descriptionに使われる説明文"
publishDate: 2026-09-08
---
ファイル名がそのままURLになるようにしたので、移行した記事はmicroCMSのIDをそのままファイル名にしています。src/content/posts/8vhec608u.md みたいな見た目になって少し間抜けですが、公開済みのURLを変えたくなかったのでそのままにしました。
スキーマには draft を持たせて、npm run dev では見えるけど本番ビルドからは外れるようにしてあります。書きかけのままpushできるので気が楽。
移行でやったこと
microCMSのリッチエディタが吐いていたHTMLをMarkdownに変換して流し込みました。
変換したあと、元のHTMLと生成後のHTMLからタグを落としてテキストだけを突き合わせて、差分が出ないことを確認しています。目視だとどこかで絶対に落とすので。
これで見つかったのが、本文にベタ書きしていたURLがMarkdownの自動リンクに巻き込まれるやつでした。プライバシーポリシーの https://ryo-suga.com(以下、「当サイト」と言います。)では、 が、全角括弧のあとの日本語までまるごとリンクのhrefに入っていて笑ってしまった。ここは明示的にリンクとして書き直しています。
あとmicroCMSのリッチエディタは外部リンクに target="_blank" を付けてくれていたので、Markdownからも同じHTMLが出るようにプラグインを1つ書きました。いまのAstroはMarkdownの処理系がSätteriになっていて、rehypeのプラグインではなくhastのプラグインとして書く形になっています。
3年半前の自分に詰まらされた
移行自体はすんなり終わったのですが、Cloudflare Pagesのビルドが Node.js v16.19.0 is not supported by Astro! で落ちました。
前の記事にこう書いてあります。
Node.jsのバージョンに関しては(現時点でのLTS v18では動作しないので) 環境変数
NODE_VERSIONに16.19.0を設定してあげてれば上手いことビルドが通りました。
当時の自分が入れた環境変数がそのまま残っていて、Astroを2から7に上げたあともNode.js 16でビルドしようとしていたやつでした。Pages側の環境変数を更新して解決。
環境変数にだけ書いた設定は3年半後に忘れる、というのを身をもって学びました。
これから
記事を書くときの手順は、ブランチを切ってMarkdownを1ファイル足してPRを作るだけになりました。PRではビルドが通るかどうかだけCIで見ています。
この記事自体も、移行後のリポジトリをそのまま読ませて書かせたものです。
書き始めるまでの手数がだいぶ減ったので、少しは更新頻度が上がるといいんですが。