東洋瞑想の古典籍・記事・用語集をつなぐ、長期運用前提のデジタルアーカイブ構築

 大学の研究プロジェクトが公開を予定している、東洋の瞑想に関するデジタルアーカイブを構築しています。
非技術者でも簡単にコンテンツを更新できるWordPressのような管理画面と、外部からの攻撃を受けにくい公開の仕組みを一つにまとめています。

プロジェクトの終了後も公開を続けられるよう、最小限の保守で運用でき、特定の制作会社にも依存しない構成を設計しました。
公開サイトは静的サイトとしてCDNから配信するため、管理画面が停止しても閲覧に影響しません。
コンテンツはMarkdown形式で一括して取り込み・書き出しができ、別の環境へのデータ移行にも対応しやすくしています。

公開サイトは、Astroでビルドした静的ファイルをCloudflare Pagesから配信します。閲覧のたびにページを生成するサーバーやデータベースを持たないため、アクセスが増えても表示が遅くなりにくい構成です。
管理画面は接続元を制限したVPSに分離し、外部から攻撃を受ける範囲も抑えています。
サイト内検索もPagefindの索引を静的ファイルとして配信するため、検索用のサーバーは必要ありません。
動的な処理が必要な問い合わせフォームはCloudflare Pages Functionsで受け付け、Turnstileでスパムを防いだうえで、Cloudflare Email Serviceで運営宛てにメールを送信します。

管理画面には、Markdownの編集と公開画面に近いプレビュー、入力チェック、取り込み時の差分確認を備え、記述ミスや参照切れを公開前に見つけられるようにしました。
公開の操作からサイトのビルド、Cloudflare Pagesへの反映までを自動で実行する仕組みも用意しました。
管理者と編集者の権限分けと操作記録により、複数人での運用にも対応しています。

他社が制作したPC向けデザインを引き継ぎ、スマートフォン向けの画面は新たに設計しました。
目次の開閉や用語集の一覧と詳細の切り替えなど、画面幅に合わせて読みやすさと操作性を調整しています。
現在は試用環境でお客様の確認を受けながら、本番公開に向けて開発を進めています。

【主な機能】
トップページ（日替わりコンテンツの表示、お知らせ、最新研究、Q&A）
学び（コース別の章立て記事、コラム、目次）
テキスト（階層分類、複数訳の切り替え、目次、訳注、段落へのリンク）
用語集（五十音・カテゴリ検索、関連語、本文からのポップアップ表示）
サイト内検索（全文検索、テキストの絞り込み検索、表記ゆれ対応）
ご意見・情報提供フォーム（スパム対策、メール送信、送信先の変更）
コンテンツ編集（Markdownエディタ、ルビ・脚注・囲みなどの独自記法、プレビュー）
入力チェック、下書き／レビュー待ち／公開の状態管理、編集履歴の保存
Markdownの取り込み（差分確認）、ZIPでの一括書き出し
分類・マスタ管理（分類軸、テキスト階層、訳者、著作権表示、表記ゆれ規則）
固定ページの編集
ログイン、管理者／編集者の権限管理、操作記録
サイトの公開（ビルド、Cloudflare Pagesへの反映、公開履歴）

【開発期間】
約4か月（開発継続中）

【担当範囲】
要件整理、データ設計、画面設計、システム設計、開発、テスト、サーバー環境構築

【使用技術】
公開サイト：Astro / TypeScript / Pagefind / markdown-it
管理画面：React / TypeScript / Vite / CodeMirror
バックエンド：Go（gin / gorm）
データベース：SQLite
インフラ：VPS、Docker（試用環境）、Cloudflare（Pages / Pages Functions / Turnstile / Email Service / Email Routing）
その他：Cookieセッション認証、Playwright（画面・操作の自動テスト）
【対応端末】
PC、スマートフォン、タブレット