kofonte.jp 構築記録 (2/2)

kofonte.jp をポートフォリオから技術ノートに作り直した

ポートフォリオ・ブラウザゲーム・D1 の動的ブログ・会員機能を全部やめ、Markdown を git で管理する静的な技術ノートに作り直した記録。何を捨て、何を残し、どう運用するか。

公開

2026-05 に作ったサイトは、ポートフォリオ(自己紹介・経歴・実績)を中心に、ブラウザゲーム 8 本、Workers + D1 + R2 で動く動的ブログ、会員登録とダッシュボード、M365 のポータルリンク集が同居していた。 9 月に方針を変え、自宅ラボで得た技術知見を蓄えるノートとして作り直した。

捨てたもの#

機能理由
ポートフォリオ(自己紹介・経歴・実績)目的が変わった。名前や経歴を置く必要がない
ブラウザゲームとランキング約 6,000 行。ノートと無関係で、保守だけ残る
会員登録・ログイン・ダッシュボード書き手は 1 人。認証を持つ理由がない
D1 上の動的ブログと Web エディタ下記
お問い合わせフォーム外部サービス(Web3Forms・hCaptcha)への依存と CSP の例外が消える

なぜ D1 の動的ブログをやめたか#

6 月に「静的 Markdown への fallback を廃止し、記事は D1 で持つ」と決めていた。これを覆した。

  • バックアップが無い。 D1 の中身は git に無く、壊れたら戻せない。Markdown なら履歴ごと git に残る
  • 書く場所が増える。 普段の記録はすべて Markdown で書いている。ブログだけ Web エディタなのは動線が二重になる
  • 動く部品が多い。 Worker・D1・R2・セッション・rate limit・orphan 管理。記事 3 本のために持つ構成ではなかった
  • 検索やRSS まで動的にしたことで、静的サイトの利点(ビルド時に全部決まる、落ちない)を自分で捨てていた

「Markdown を push すると公開される」に戻す。これが最初の設計でもあった。

いまの構成#

項目採用
フレームワークAstro 5(静的生成、Content Collections)
記事src/content/notes/<slug>.md。ファイル名がそのまま URL
検索Pagefind。ビルド時に索引を作り、ブラウザ内で照合する
RSS・sitemap@astrojs/rss@astrojs/sitemap でビルド時に生成
コードハイライトShiki。ライト/ダークの 2 テーマを CSS 変数で切り替え
ホスティングCloudflare Pages。main への push で自動デプロイ

外部に読みに行くものが無くなったので、CSP は default-src 'self' にほぼ収まる。 例外は Pagefind の WebAssembly('wasm-unsafe-eval')と、Cloudflare Web Analytics のビーコンだけ。

記事の frontmatter#

---
title: "記事タイトル"
description: "一覧と OGP に出る要約"
pubDate: 2026-09-23
updatedDate: 2026-09-30   # 任意
series: "kofonte.jp 構築記録"   # 任意。シリーズ内は古い順に前後リンクが付く
tags: [Astro, Cloudflare]
draft: false              # true は本番ビルドから除外
---

URL について#

記事の URL は /notes/<slug>/ に変えた。旧 /blog/* は Workers のルート(www.kofonte.jp/blog/*)が受けているため、Pages 側の _redirects では転送できない。 Worker のルートを外すのは別作業にした。外したあとに /blog/<slug>/ から /notes/<slug>/ への 301 を足す。

運用#

  1. src/content/notes/ に Markdown を書く
  2. npm run verify(型検査 + ビルド + 索引生成)
  3. git push。1〜3 分で公開

管理画面も DB もない。月に一度 npm outdatednpm audit を見るだけ。