RepoMap - Interactive Codebase Dependency Visualizer for TypeScript Monorepos
CodeSee went closed-source and left thousands of devs staring at spaghetti imports with no map. RepoMap is a CLI-first tool that generates interactive SVG dependency graphs from TypeScript and Node codebases in under 10 seconds. Think 'git log' but for your architecture.
Difficulty
intermediate
Category
Developer Tools
Market Demand
Very High
Revenue Score
8/10
Platform
CLI Tool
Vibe Code Friendly
No
Hackathon Score
🏆 8/10
Validated by Real Pain
— seeded from real developer complaints
Developers expressed frustration after a popular codebase visualization tool removed its open-source offering, leaving teams without an affordable way to map large TypeScript repositories and forced back to manual grep and IDE breadcrumbs.
What is it?
When CodeSee shuttered its open-source tier, developers lost the only affordable way to visually navigate complex codebases — and the workarounds (grep, IDE breadcrumbs, manual Miro diagrams) are embarrassingly manual. RepoMap is a CLI tool that parses your tsconfig and import graph, then outputs a zoomable, filterable SVG or 3D force-directed graph you can share via a public URL. Teams can annotate nodes, pin critical paths, and embed the graph in their GitHub README. The cloud tier adds persistent team workspaces, diff-aware graph snapshots on each PR, and Slack notifications when dependency depth spikes. Buildable because ts-morph and d3-force are stable, Supabase handles graph storage trivially, and the April 2026 vibe-coding wave means devs will share this on X the minute it ships.
Why now?
CodeSee closed its open-source tier in late 2024, leaving a documented void with active HN complaint threads — and ts-morph plus d3-force are both stable and trivially composable today.
- ▸CLI parser that reads tsconfig and generates SVG/JSON graph in under 10 seconds (ts-morph AST walk)
- ▸Zoomable, filterable web viewer hosted at a shareable public URL (d3-force + Next.js)
- ▸PR diff-aware snapshots that highlight new dependency edges on each merge (GitHub webhook)
- ▸Team workspace with node annotations and pinned critical paths (Supabase RLS per team)
Target Audience
TypeScript and Node.js developers in teams of 3-20, especially monorepo maintainers — estimated 400k+ active TS monorepo projects on GitHub.
Example Use Case
A senior dev joins a 4-year-old Node.js monorepo, runs 'npx repomap', gets an interactive graph in 8 seconds, pins the three critical shared modules, shares the URL in Slack, and onboards in 2 hours instead of 2 days.
User Stories
- ▸As a new team member, I want to generate a visual map of all TypeScript imports, so that I can understand the codebase architecture in under an hour.
- ▸As a maintainer, I want PR-diff graph snapshots, so that I can catch unexpected new dependencies before merge.
- ▸As a team lead, I want a shareable annotated graph URL, so that my team can bookmark critical module paths during onboarding.
Acceptance Criteria
CLI Parse: done when 'npx repomap' on a 50-file TS project produces a valid SVG in under 10 seconds. Web Viewer: done when graph is zoomable, filterable by module path, and loads in under 2 seconds. Cloud Save: done when CLI outputs a public URL that a non-authenticated user can open in browser. Billing: done when Stripe checkout gates team annotation features behind paid plan.
Is it worth building?
$15/month x 100 teams = $1,500 MRR at month 3. $15/month x 500 teams = $7,500 MRR at month 8. Math: 5% conversion from free CLI installs, 200 installs/week via ProductHunt and HN.
Unit Economics
CAC: ~$5 via organic HN/Reddit. LTV: $270 (18 months at $15/month). Payback: under 1 month. Gross margin: 92%.
Business Model
Free CLI, $15/month for cloud storage and team features
Monetization Path
Free CLI with local SVG export. Cloud tier unlocks shareable URLs, PR diffs, and team annotations.
Revenue Timeline
First dollar: week 3 via early cloud signup. $1k MRR: month 3. $5k MRR: month 9.
Estimated Monthly Cost
Vercel: $20, Supabase: $25, Stripe fees: $15 at early revenue. Total: ~$60/month at launch.
Profit Potential
Full-time viable at $5k-$10k MRR with low churn given workflow stickiness.
Scalability
High — add VS Code extension, GitHub Action integration, and enterprise SSO in later versions.
Success Metrics
Week 1: 500 npm installs. Week 3: 50 cloud signups. Month 2: 30 paid teams, 80% month-2 retention.
Launch & Validation Plan
Post in r/typescript and HN asking 'CodeSee alternatives?' thread, collect 20 email signups before writing a line of code.
Customer Acquisition Strategy
First customer: reply directly in the HN thread mourning CodeSee closure with a working demo link and offer 6 months free for feedback. Ongoing: ProductHunt launch, npm trending, HN Show HN, partner with Turborepo and Nx Discord communities.
What's the competition?
Competition Level
Low
Similar Products
CodeSee (closed-source now), Madge (no web viewer, no teams), Nx Graph (Nx-only, not generic TS) — RepoMap fills the open-source, framework-agnostic gap.
Competitive Advantage
Open-source CLI (free forever) with a cloud upgrade path — unlike Mermaid which is manual and unlike enterprise tools which cost $300/month.
Regulatory Risks
Low regulatory risk. No PII handled — only code structure metadata.
What's the roadmap?
Feature Roadmap
V1 (launch): CLI parser, SVG export, web viewer, cloud save URL. V2 (month 2-3): PR diff snapshots, team annotations, GitHub Action. V3 (month 4+): VS Code extension, Nx/Turborepo deep integration, SSO.
Milestone Plan
Phase 1 (Week 1-2): CLI ships, generates graph, exports SVG locally. Phase 2 (Week 3-4): web viewer live, Supabase cloud save, Stripe billing. Phase 3 (Month 2): PR diff snapshots, GitHub webhook, ProductHunt launch.
How do you build it?
Tech Stack
Node.js CLI, ts-morph for AST parsing, d3-force for graph rendering, Next.js for web viewer, Supabase for storage, Stripe for billing — build with Cursor for CLI core, v0 for graph UI components
Suggested Frameworks
ts-morph, d3-force, Next.js
Time to Ship
2 weeks
Required Skills
Node.js CLI tooling, TypeScript AST parsing with ts-morph, basic d3-force graph rendering.
Resources
ts-morph docs, d3-force examples, Supabase quickstart, npm publish guide.
MVP Scope
cli/index.ts (ts-morph parser), cli/graph-builder.ts, cli/svg-export.ts, web/pages/index.tsx (viewer), web/components/GraphCanvas.tsx (d3), web/pages/api/save-graph.ts, supabase/schema.sql, .env.example, README.md, package.json with bin entry.
Core User Journey
npx repomap -> graph generated locally -> share URL -> teammate opens browser viewer -> team upgrades to cloud plan.
Architecture Pattern
CLI runs ts-morph AST parse -> builds JSON graph -> uploads to Supabase Storage -> returns shareable URL -> Next.js viewer fetches JSON -> d3-force renders interactive graph -> team annotations saved via Supabase RLS.
Data Model
User has many Teams. Team has many Graphs. Graph has many Nodes and Edges. Graph has many Snapshots (one per PR diff).
Integration Points
ts-morph for AST parsing, d3-force for graph rendering, Supabase for graph storage and team auth, Stripe for billing, GitHub Webhooks for PR diff snapshots, Vercel for hosting.
V1 Scope Boundaries
V1 excludes: JavaScript support, VS Code extension, GitHub Action, mobile app, SSO, white-label.
Success Definition
A stranger npm installs RepoMap, generates a graph for their codebase, shares the URL with their team, and upgrades to paid without ever contacting the founder.
Challenges
Distribution is the hard problem — CLI tools live and die by whether they get into the HN front page and npm trending lists. Getting the first 500 installs without paid ads requires a very shareable demo GIF.
Avoid These Pitfalls
Do not spend week one on the 3D renderer — ship flat SVG first and validate. Do not support JavaScript projects in v1, TypeScript-only keeps scope tight. Finding your first 10 paying teams will take longer than building the CLI — budget 3x time for distribution.
Security Requirements
Supabase Auth with GitHub OAuth. RLS on all graph and team tables. Rate limit CLI upload endpoint at 30 req/min per IP. Input validation on graph JSON schema before DB insert. GDPR: graphs deletable via dashboard.
Infrastructure Plan
Vercel for Next.js viewer, Supabase for Postgres and file storage, GitHub Actions for npm publish CI, Sentry for error tracking, dev/staging/prod via Vercel preview URLs.
Performance Targets
Launch: 200 DAU, 2k req/day. CLI graph generation under 10s for 200-file repos. Web viewer load under 2s. Static graph JSON cached at CDN edge.
Go-Live Checklist
- ☐Security audit complete
- ☐Payment flow tested end-to-end
- ☐Sentry error tracking live
- ☐Vercel analytics configured
- ☐Custom domain with SSL set up
- ☐Privacy policy and terms published
- ☐5 beta devs signed off
- ☐Rollback plan documented
- ☐HN Show HN post drafted.
How to build it, step by step
1. Run 'npm init' and scaffold CLI with commander.js. 2. Install ts-morph and write import graph walker. 3. Build JSON-to-SVG exporter using d3-force in Node. 4. Run 'npx create-next-app' for the web viewer. 5. Build GraphCanvas component with d3-force pan and zoom. 6. Set up Supabase project and create graphs table with RLS. 7. Add /api/save-graph endpoint that stores JSON and returns public URL. 8. Add Stripe billing with $15/month plan gating team features. 9. Publish CLI to npm with 'bin' entry pointing to index.ts. 10. Deploy Next.js viewer to Vercel and post demo GIF on X and HN.
Generated
April 1, 2026
Model
claude-sonnet-4-6