このサイトの構成について

このサイト(orbis-pictus.jp) は、大きく分けて data/ 、 api/ 、 frontend/ の3つのレイヤーで構成されています。

1. 全体の構成図

1.1 ディレクトリ構造

orbis-pictus.jp/
├── data/       # コンテンツのソースファイル（YAML + Markdown）
├── api/        # Rust / Axum による REST API サーバー
├── frontend/   # Deno + Preact による SSG
└── www/        # 生成された静的ファイル（PHP）

1.2 ビルドプロセス

ビルド時の流れは以下の通りです。

1. data/ 以下にあるコンテンツファイルを api/ が読み込む
2. api/ が JSON として返す
3. frontend/ が API を叩いて静的ファイルを生成し www/ に書き出す

以前はデータの取得、加工からHTMLの生成までを一つのシステムの中に混在させていたのですが、コードの見通しが悪く、コンテンツを追加しづらかったため、改修しました。

2. データ data/

記事・用語集・観察記録などすべてのコンテンツが置かれています。データは全てテキストファイルで、YAMLヘッダーをもつMarkdownファイルが主です。

2.1 DBにしない理由

過去のバージョンでは全てのデータをMySQLに格納していました。
しかし、運用を続けていく中で以下の理由から、現在はテキストファイルに落ち着いています。

• 記事の更新のコスト
  • いちいちDBを更新したり、記事編集用の管理画面を作りたくない。
  • エディタを開いてささっと書き換えたい。
• データの扱いやすさ
  • テキストファイルなので、どこにでも保存できる。
  • ポータビリティも高い

YAMLヘッダーに持つメタデータの構造などが変わったときは、一括で処理するスクリプトで書き換えていました。

2.2 代表的なディレクトリ

data/
├── articles/       # 生き物の図鑑記事（YAML）
├── blogs/          # ブログ記事（Markdown）
├── tech/           # 技術ブログ記事（Markdown）
├── observations/   # 観察記録
└──