GitDiagram: visualize a estrutura da sua base de código do GitHub e transforme seu repositório de código em um diagrama interativo da arquitetura do sistema.

GitDiagram是一款创新的GitHub代码库可视化工具，能够将任何GitHub仓库快速转换为交互式系统架构图。它采用先进的AI技术（Claude 3.5 Sonnet），为开发者提供了一种全新的代码库浏览和理解方式。用户只需将GitHub URL中的”hub”替换为”diagram”，即可立即生成对应仓库的可视化图表。该工具不仅支持即时可视化转换，还提供了强大的交互功能，允许用户直接点击图表组件来导航至源代码文件和相关目录，大大提升了代码库的可读性和可理解性。GitDiagram采用现代化技术栈开发，包括Next.js、FastAPI和PostgreSQL等，确保了工具的高性能和可靠性。

Experiência: https://gitdiagram.com/

Lista de funções

• Conversão visual instantânea: converta rapidamente a estrutura do repositório do GitHub em diagramas de projeto/arquitetura do sistema
• Navegação interativa inteligente: suporta acesso direto a arquivos e diretórios de origem clicando nos componentes do diagrama
• Geração orientada por IA: garantindo velocidade e precisão na geração de gráficos com o Claude 3.5 Sonnet
• Personalização: suporte para modificar e gerar novamente os gráficos de acordo com as instruções do usuário
• URL快捷访问：通过替换GitHub URL中的”hub”为”diagram”即可使用
• Suporte completo à API: forneça uma interface de API pública para integração (em desenvolvimento)
• Atualizações em tempo real: suporte a atualizações visuais em tempo real de alterações na estrutura da base de código
• Implementação personalizada: solução completa de implementação auto-hospedada disponível

Usando a Ajuda

Processo de uso básico

• Insira a URL do repositório do GitHub ou use o método de conversão de URL diretamente
• Aguardando que o sistema gere automaticamente um diagrama de arquitetura interativo
• Clique em um componente no diagrama para navegar diretamente para o arquivo de código-fonte correspondente.

Descrição das restrições de uso

A versão gratuita atual tem as seguintes restrições de uso:

• Limite de 1 solicitação de geração de gráfico por minuto
• Limite de 5 solicitações de geração de gráficos por dia
• Programa opcional de autoimplantação, caso você precise se livrar das restrições

Guia de implantação auto-hospedada

1. Preparação ambiental

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

2. Configuração de variáveis de ambiente
   • Copiar .env.example como .env
   • Configuração das chaves da API do Anthropic
   • Configuração opcional de tokens de acesso pessoal do GitHub
3. Início dos serviços de back-end

   docker-compose up --build -d
   

   • O serviço de back-end será executado em localhost:8000
   • Visualização de registros com docker-compose logs -f
4. Configurações do banco de dados

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

   • O banco de dados será executado em localhost:5432
   • Usando o pnpm db:studio, você pode visualizar e gerenciar bancos de dados
5. Início dos serviços de front-end

   pnpm dev
   

   • Visite localhost:3000 para usar a versão implantada localmente

Uso de funções avançadas

1. Comandos personalizados
   • A geração de gráficos pode ser modificada com o fornecimento de comandos personalizados por meio da interface.
   • Suporte para adaptação às necessidades de visualização de uma estrutura de base de código específica
2. Integração de API
   • As APIs públicas em desenvolvimento darão suporte à integração de sistemas de terceiros
   • Visualização da base de código que pode ser automatizada por meio de APIs

Dicas e truques

1. Para grandes armazéns
   • Recomenda-se concentrar-se primeiro na estrutura dos módulos principais
   • Detalhamento passo a passo dos detalhes com navegação interativa
2. otimização do desempenho
   • O uso de uma solução auto-hospedada pode quebrar as limitações padrão
   • Considere usar sua própria chave de API do Anthropic para obter melhor desempenho