GitDiagram: GitHubコードベースの構造を視覚化し、コードリポジトリをインタラクティブなシステムアーキテクチャ図に変換します。

はじめに

GitDiagramは、GitHubリポジトリをインタラクティブなシステム・アーキテクチャ図に素早く変換する、革新的なGitHubコードベース可視化ツールです。先進的なAI技術（Claude 3.5 Sonnet）を採用し、開発者にコードベースの新しい見方と理解を提供します。GitHubのURLの "hub "を "diagram "に置き換えるだけで、対応するリポジトリのビジュアルなダイアグラムが即座に生成されます。GitDiagramは、Next.js、FastAPI、PostgreSQLを含む最新の技術スタックを使用して開発されており、高いパフォーマンスと信頼性を保証します。高いパフォーマンスと信頼性。

経験：https://gitdiagram.com/

機能一覧

• 即座にビジュアル変換: GitHubのリポジトリ構造をシステム設計/アーキテクチャ図に素早く変換します。
• インテリジェントなインタラクティブナビゲーション：ダイアグラムのコンポーネントをクリックすることで、ソースファイルやディレクトリへの直接アクセスをサポート
• AI駆動ジェネレーション：クロード3.5ソネットでチャート生成の速度と精度を確保
• カスタマイズ：ユーザー指示によるチャートの修正と再生のサポート
• URLショートカット：GitHubのURLは、"hub "を "diagram "に置き換えて使用してください。
• APIフルサポート：統合用のパブリックAPIインターフェースを提供（開発中）
• リアルタイム更新: コードベース構造への変更をリアルタイムで視覚的に更新。
• カスタムデプロイメント：完全なセルフホストデプロイメントソリューションが利用可能

ヘルプの使用

基本的な使用プロセス

• GitHub リポジトリの URL を入力するか、URL 変換メソッドを直接使用します。
• システムがインタラクティブなアーキテクチャ図を自動生成するのを待つ
• ダイアグラム内のコンポーネントをクリックすると、対応するソース・コード・ファイルに直接移動します。

使用制限の説明

現在の無料版には以下の使用制限があります：

• チャート作成リクエストは1分間に1回まで
• チャート作成リクエストは1日5件まで
• 制約から抜け出す必要がある場合、オプションの自己派遣プログラム

セルフホスト導入ガイド

1. 環境準備

   git clone https://github.com/ahmedkhaleel2004/gitdiagram.git
   cd gitdiagram
   pnpm i
   

2. 環境変数の設定
   • .env.exampleを.envにコピーする
   • Anthropic APIキーの設定
   • GitHubパーソナルアクセストークンのオプション設定
3. バックエンド・サービスの開始

   docker-compose up --build -d
   

   • バックエンドのサービスは localhost:8000 で実行されます。
   • docker-compose logs -f によるログの表示
4. データベース設定

   chmod +x start-database.sh
   ./start-database.sh
   pnpm db:push
   

   • データベースは localhost:5432 で実行されます。
   • pnpm db:studio を使用すると、データベースを表示および管理できます。
5. フロントエンド・サービスの開始

   pnpm dev
   

   • ローカルにデプロイされたバージョンを使用するには、localhost:3000にアクセスする。

高度な機能の使用

1. カスタムコマンド
   • チャート生成は、インターフェイスを通じてカスタムコマンドを提供することで変更できる。
   • 特定のコードベース構造の視覚化ニーズに適応するためのサポート
2. API統合
   • 開発中の公開APIは、サードパーティのシステム統合をサポートする。
   • APIで自動化できるコードベースの可視化

ヒントとコツ

1. 大型倉庫用
   • まず、主要モジュールの構造に注目することをお勧めする。
   • インタラクティブ・ナビゲーションによる詳細へのステップ・バイ・ステップのドリルダウン
2. パフォーマンス最適化
   • セルフホスト・ソリューションを使えば、デフォルトの制限を破ることができる。
   • より良いパフォーマンスのために、独自のAnthropic APIキーの使用を検討してください。