Mcpdoc

🚀 C4Diagrammer

C4Diagrammerは、ソフトウェアシステムのアーキテクチャ図を自動生成するツールです。このツールは、プロジェクトのコード構造とファイルの組織方法を分析し、C4モデル（Context、Container、およびComponent）に対応するダイアグラムを生成します。これにより、開発者はシステムの構造やコンポーネント間の関係をより深く理解することができます。

🚀 クイックスタート

C4Diagrammerを使用することで、ソフトウェアシステムのアーキテクチャ図を自動生成できます。以下のセクションでは、インストール方法や使用方法を詳しく説明します。

✨ 主な機能

• C4 Context、Container、およびComponentのダイアグラムを自動生成します。
• 各サブディレクトリに対して、そのディレクトリの機能とコンポーネントを概説するREADMEファイルを生成します。
• 多言語プロジェクトに対応しており、現在は主にTypeScriptとPythonをサポートしています。

📦 インストール

1. プロジェクトリポジトリをクローンします。

git clone https://github.com/yourusername/C4Diagrammer.git

2. 依存関係をインストールします。

'PromptRepository' リポジトリをクローンしてインストールします。

npm run install

3. プロジェクトをビルドします。

npm run build

💻 使用例

基本的な使用法

MCPサーバーをホスト上で使用するには、AI開発環境を更新する必要があります。一般的な設定は以下の通りです。2番目のパラメータは、ファイルシステムのアクセス権限の範囲を制限します。

{
  "mcpServers": {
    "mcp-documenter": {
      "command": "node",
      "args": ["YourCodeRoot/C4Diagrammer/dist/src/index.js", "YourCodeRoot"]
    }
  }
}

特定のIDEの設定については、以下のリンクを参照してください。

• Cursor: https://docs.cursor.com/context/model-context-protocol
• Claude: https://modelcontextprotocol.io/quickstart/user

📚 ドキュメント

ドキュメントは「dogfooding」によって生成されます。C4Diagrammerは、各サブディレクトリにREADME.C4Diagrammer.mdとC4Component.C4Diagrammer.mdを生成し、ルートディレクトリにC4ContextとC4Containerを生成します。

• ./C4Context.C4Diagrammer.md - C4Contextダイアグラムの概要
• ./C4Container.C4Diagrammer.md - C4Containerダイアグラムの概要
• src/README.C4Diagrammer.md - ソースコードのドキュメント
• src/C4Component.C4Diagrammer.md - ソースコードのコンポーネントダイアグラム
• test/README.C4Diagrammer.md - テストスイートのドキュメント
• test/C4Component.C4Diagrammer.md - テストスイートのコンポーネントダイアグラム

🔧 技術詳細

C4Diagrammerは、以下の主要なコンポーネントで構成されています。

1. MCPサーバー：AI開発環境とのやり取りを処理し、リクエストを受け取り、生成されたダイアグラムを返します。
2. PromptRepository：ダイアグラム生成に必要なプロンプト文を格納するリポジトリです。
3. FS Access：ファイルシステムへのアクセス権限を管理する機能を提供します。

📄 ライセンス

このプロジェクトは MIT License に基づいてライセンスされています。

テスト

プロジェクトには、Mochaを使用して記述された単体テストが含まれています。

npm run test