architecture-diagrams

アーキテクチャ図

目次

• 概要
• 使用する場面
• クイックスタート
• リファレンスガイド
• ベストプラクティス

概要

Mermaid や PlantUML などのコードベースの図表作成ツールを使って、システム設計、データフロー、技術文書向けの明確で保守しやすいアーキテクチャ図を作成します。

使用する場面

• システムアーキテクチャのドキュメント作成
• C4 モデル図
• データフロー図
• シーケンス図
• コンポーネント間の関係
• デプロイメント図
• インフラストラクチャアーキテクチャ
• マイクロサービスアーキテクチャ
• データベーススキーマ（視覚化）
• 統合パターン

クイックスタート

最小限の実行可能な例：

graph TB
    subgraph "Client Layer"
        Web[Web App]
        Mobile[Mobile App]
        CLI[CLI Tool]
    end

    subgraph "API Gateway Layer"
        Gateway[API Gateway<br/>Rate Limiting<br/>Authentication]
    end

    subgraph "Service Layer"
        Auth[Auth Service]
        User[User Service]
        Order[Order Service]
        Payment[Payment Service]
        Notification[Notification Service]
    end

    subgraph "Data Layer"
        UserDB[(User DB<br/>PostgreSQL)]
        OrderDB[(Order DB<br/>PostgreSQL)]
        Cache[(Redis Cache)]
        Queue[Message Queue<br/>RabbitMQ]
    end
// ... (see reference guides for full implementation)

リファレンスガイド

references/ ディレクトリにある詳細な実装：

ガイド	内容
システムアーキテクチャ図	システムアーキテクチャ図
シーケンス図	シーケンス図
C4 コンテキスト図	C4 コンテキスト図
コンポーネント図	コンポーネント図
デプロイメント図	デプロイメント図
データフロー図	データフロー図
クラス図	クラス図
コンポーネント図	コンポーネント図
デプロイメント図	デプロイメント図

ベストプラクティス

✅ 推奨事項

• 記法と記号を統一します
• 複雑な図には凡例を含めます
• 図の焦点を1つの側面に絞ります
• 色分けに意味を持たせます
• タイトルと説明を含めます
• 図をバージョン管理します
• テキストベースの形式（Mermaid、PlantUML）を使用します
• データフローの方向を明確に示します
• デプロイメントの詳細を含めます
• 図の規約を文書化します
• 図をコードの最新状態に保ちます
• サブグラフを使って論理的にグループ化します

❌ 避けるべき事項

• 図に詳細を詰め込みすぎます
• 一貫性のないスタイルを使用します
• 図の凡例を省略します
• バイナリ画像ファイルだけを作成します
• 関係性の文書化を忘れます
• 1つの図で抽象化レベルを混在させます
• プロプライエタリな形式を使用します