Hero Image
投稿日:

記事の管理を microCMS に移行しました

IT技術更新情報

このサイトの記事はこれまで(といっても3記事だけですが)マークダウンファイルに愚直に書いていました。

今回はそれを、記事を作成・管理を楽にするために microCMS に移行しました。

これまで

マークダウン形式とは、かんたんな書き方で文章を装飾できる記述方式です。

例えば以下のように、`#` や `*` で「この文章はどのような意味を持つか」を示します。

# 記事タイトル
## 概要
このようにかんたんに**太字**にしたりすることができます。
## できること
- リスト
-- URL
なども記号だけで表現できます。
<span style="font-size: 3rem; font-weight: bold;">HTMLタグも使用できます</span>

また、このサイトは Astro というフレームワークで作られていますが、マークダウンに自作コンポーネント(画面要素のパーツ)を埋め込むためのMDXに対応しています。

そのため、ゲームのキャプチャー画像を使用するにあたりALTや出典を明記できるコンポーネントを作って利用したりしていました。

<BlogImage
  src="/blog_images/i_20251017/1.jpg"
  alt="ゲーム内の架空SNSの投稿。「いやこれeicoお得意の自作自演じゃん こういうのに騙されるやつおかしいだろ?」「人間は醜い」などと書いてある。"
  credit="「都市伝説解体センター」©2025 墓場文庫/集英社ゲームズ Nintendo Switch版"
/>

ただ、こういった形式で記事を書くと、文字サイズの変更や太字の適用、表や画像やリンクの挿入を行うたびに都度それ用の記述を行わないといけないので非常に面倒くさいです。画像の配置は特にダルくて、特定のディレクトリに配置してパスを書かないといけないため余計な手間がかかり、記事内に直感的に配置することもできません。

また、記事のマークダウンファイルや記事内の画像もソースコードに含まれてしまうため、サイト自体の管理とコンテンツ管理が混ざってしまうのも嫌でした。

今度から

microCMS に記事を作成し、それを取得して表示するようにしました。microCMS はコンテンツの作成・管理画面だけを持つサービスで、このサービス上で作った記事はサイト側からリクエストすることで取得できます。

記事の編集画面が存在することによって装飾や画像挿入などの手間が減り記事が書きやすくなりますし、記事データおよび画像データをサービス側で管理してくれるので手動で配置したりパスを指定したりする必要がなくなります。

副次的なメリットとして、記事の作成や管理がWebサービス上になることでPC以外からもかんたんにアクセスして管理できるようになるのもちょっと嬉しいです。(出先の待機時間とかに下書きを作ったりできるので)

Astro への microCMS の導入は、microCMS 側のドキュメントを見ればほとんど理解できるようになっているので楽でした。自分のサイト用のカスタマイズも今はAIに聞けばなんとかなりますし。

https://blog.microcms.io/astro-microcms-introduction/


最初からCMSを利用する考えはあったもののまずはAstroのルールに則って……と思ってマークダウンで書いていましたが、あまりにも面倒くさいのでやっぱり移行したという話でした。

これで楽になる〜〜!!