깃허브 저장소를 아키텍처 다이어그램으로 변환하는 도구
ahmedkhaleel2004/gitdiagram
GitHubGitDiagram은 깃허브 저장소의 코드베이스를 분석하여 상호작용하는 시스템 아키텍처 다이어그램으로 자동 변환해주는 도구입니다.
- 단순한 폴더 구조가 아닌, 저장소 트리와 소스 코드를 기반으로 시스템 레벨 그래프를 생성하며 비공개(Private) 저장소도 지원합니다.
- 복잡한 코드베이스의 전체적인 구조를 한눈에 파악하게 도와주어, 신규 개발자의 온보딩 시간 단축 및 협업 효율성 증대에 큰 도움을 줍니다.
- 작동 과정에서 GitHub API와 오픈AI 같은 AI 모델이 사용되어 Mermaid 형식으로 변환되므로, 서비스 이용 시 비용 발생 여부를 확인해야 합니다.
GitDiagram은 공개 또는 비공개 깃허브 저장소 전체를 상호작용 가능한 시스템 아키텍처 다이어그램으로 자동 변환합니다. 이 도구는 단순히 폴더 구조를 그리는 것을 넘어, 저장소 트리와 핵심 소스 코드 발췌본을 기반으로 시스템 레벨 그래프를 생성하는 것이 특징입니다. 사용자는 다이어그램 내의 컴포넌트를 클릭하여 해당 깃허브 파일이나 디렉토리로 직접 이동할 수 있습니다.
작동 과정은 먼저 GitHub 를 통해 저장소의 기본 브랜치, 재귀적 트리, README 등을 가져오는 것부터 시작합니다. 이후 시스템은 핵심 실행 모듈을 선호하는 방식으로 검증된 소스 발췌본을 수집하고, 이를 기반으로 AI 모델(오픈AI 등) 요청을 거쳐 그래프 구조를 생성합니다. 서버는 이 과정에서 식별자 및 연결성을 검증하며, 최종적으로 Mermaid 형식의 코드로 컴파일되어 브라우저에 렌더링됩니다.
비공개 저장소 지원 시에는 사용자가 깃허브 개인 액세스 (PAT)을 제공해야 하며, 이 토큰은 관련 동일 출처 요청에만 전송되어 보안이 유지됩니다. 시스템 아키텍처는 Vercel 환경에서 Next.js 16 App Router로 구동되며, 비용 추정(`api/generate/cost`) 및 그래프 진행 상황 스트리밍(`api/generate/stream`) 등 여러 API 엔드포인트를 통해 관리되고 있습니다.
용어 풀이
- API
- 프로그램끼리 기능을 주고받는 약속된 창구. AI 모델은 보통 API로 불러 써요.
- 토큰
- AI 모델이 글을 처리하는 단위. 단어보다 작은 조각이며 사용량과 요금을 셀 때 기준이 돼요.