ARYAN PANDIT

Software Developer

Read Resume

gitMap

FastAPIReactD3Tree-sitterGitHub APITailwind

Turns any public GitHub repository into an interactive knowledge graph for visual codebase exploration.

gitMap is a visual code exploration tool that transforms any public GitHub repository into a graph of files, symbols, and relationships. Instead of cloning a repo and manually tracing structure, users can switch the domain and immediately get a first-pass map of the codebase.

The product is intentionally lightweight from the user’s perspective: change a GitHub URL to `git-map.com/owner/repo`, and the system builds an interactive visualization in the browser. That simplicity makes the tool memorable while still solving a real developer workflow problem.

Inspiration Behind It

The project comes from the friction of understanding unfamiliar repositories quickly. Before diving into implementation details, developers often want a fast structural overview of important files, symbols, and connections across the codebase.

gitMap turns that need into a visual experience. It does not try to replace reading code, but it gives users a better starting point for orientation, exploration, and architectural intuition before they go line by line.

System Architecture

Architecture Diagram

gitMap

9 nodes

ENTRYREPOSITORY ANALYSISVISUALIZATIONfetchrepo filesmapparsefile graphsymbolsserializeRepository URLInputowner/repo routeFastAPI FetchLayerRepo analysis requestGitHub APISource tree and blobsRepository FetchCacheNormalized file payloadsAider RepoMapHigh-level file mapTree-sitterParsersSymbols and edgesGraph BuilderMerge symbols and linksGraph JSON PayloadNodes and relationsReact plus D3ViewerInteractive graph

About The Flow / Architecture

The backend uses FastAPI to fetch repository contents through the GitHub API, then processes supported source files using Aider RepoMap and Tree-sitter-based parsing. From there it builds graph JSON describing nodes and links that represent structural relationships inside the repository.

The frontend uses React and D3 to render that graph interactively in the browser. This split keeps the analysis pipeline separate from the visualization layer, which makes it easier to improve parsing quality or graph performance without coupling those concerns too tightly.

gitMap gives developers a visual first look at an unfamiliar codebase by converting repository structure into an interactive graph. It supports multiple source file types and uses parser-driven graph construction rather than relying on a shallow file listing.

The repository combines backend analysis, graph construction, and a D3-based frontend experience. It stands out in the projects section because it blends developer tooling, interface design, and code intelligence into a compact but memorable product.

View Project