Skip to content
Devtools

Interactive Codebase Map

Explore a codebase as a map of modules, dependencies and owners.

Advanced24h2–3 people17/20 fit
TL;DR

Build Interactive Codebase Map for new team members in ~24h with 2–3 people. Stack: Tree-sitter + ECharts + LLM.

Why it wins: Impressive visual with clear onboarding value.

Build flow

01 · Problem
New developers take weeks to understand a large codebase.
02 · Solution
Parse code with tree-sitter, build a module and call graph, show it as an interactive map with summaries and owners.
03 · Build
  1. 1Parse files
  2. 2Build graph
  3. 3Summarise modules
  4. 4Render map
04 · Demo
Click a module and see its summary and dependencies.

MVP checklist

  • Module graph
  • Call edges
  • Summaries
  • Ownership

Tech stack

TechRole
Tree-sitterCode parsing
EChartsInteractive charts
LLMLanguage model

Reference repos

Open-source projects you can build on. Links checked 2026-10-31.

Related ideas

More Devtools

  • Devtools

    Guided Code Tours

    Record step-by-step tours through a codebase that newcomers can follow

    Intermediate14h1–2
    Tree-sitterLLMNext.js
    17/20

  • Devtools

    SQL Query Plan Visualizer

    Turn a database query plan into a visual tree with plain-language tips

    Intermediate14h1–2
    PostgresEChartsLLM
    17/20