Skip to content

Repository files navigation

CodeAtlas

Understand any codebase in minutes.

CodeAtlas es una aplicación de escritorio que analiza proyectos locales y presenta su estructura y señales arquitectónicas en una interfaz navegable. La versión 0.1 se concentra en proyectos JavaScript y TypeScript.

Versión, fase y descargas

CampoValor
Versión0.1.0 (package.json) — visible en la barra de la app
FaseMVP (v0.1) · desarrollo activo
LicenciaMIT

Plataformas disponibles

Sistema operativoArtefacto
Linux.AppImage (y .snap)
WindowsInstalador .exe (NSIS) y portable .exe
macOS.dmg y .zip

Descargar

Los binarios se generan automáticamente con GitHub Actions al crear un tag v* y se publican en GitHub Releases. Descarga el artefacto de tu sistema operativo en la última release.

Los binarios no están firmados: en Windows el SmartScreen y en macOS Gatekeeper mostrarán una advertencia al primer arranque (se salta con "Más información → Ejecutar de todas formas" / clic derecho → Abrir).

Estado actual

El MVP incluye:

  • Electron, React, TypeScript y Vite.
  • Selección segura de un repositorio local mediante IPC.
  • Árbol de archivos con exclusión de dependencias y artefactos de build.
  • Detección y parseo de package.json.
  • Detección de usos de process.env.
  • Detección heurística de rutas Express y NestJS (decoradores @Controller/@Get/@Post y similares), con método, ruta completa, archivo y línea. Sus límites se documentan en la sección Límites de los detectores heurísticos.
  • Detección de imports y require, resolviendo rutas relativas entre módulos.
  • Modelo de grafo común para archivos, rutas, variables, paquetes y dependencias.
  • Mapa interactivo con React Flow: pan, zoom, minimapa y nodos coloreados por tipo.
  • Selección de nodo: resaltado de dependencias y panel de detalles con "Depende de" / "Usado por".
  • Apertura de archivo y línea en el IDE preferido: VS Code, Cursor, Windsurf, Zed, Sublime, JetBrains, Xcode y Visual Studio (detección automática).
  • Manejo de directorios inaccesibles y errores de IPC.
  • Análisis en un worker_threads dedicado: Electron nunca se congela y la interfaz muestra una barra de progreso con fases y porcentaje en vivo.
  • Suite automatizada del analizador con Vitest.

Límites de los detectores heurísticos (v0.1)

Los detectores del analizador son heurísticos basados en expresiones regulares, no en un AST real: pueden arrojar falsos positivos y falsos negativos. Son útiles para orientarse en un proyecto desconocido, no para auditorías exhaustivas. La suite de pruebas cubre los comportamientos descritos aquí.

Rutas Express (src/analyzer/routescan.ts)

Detecta llamadas app|router|api o variables terminadas en Router/App con métodos get/post/put/patch/delete/all/use y una ruta literal entre comillas. Límites:

  • Solo rutas de una línea: las llamadas multilínea no se detectan.
  • Solo rutas literales: las plantillas o variables (app.get(\/users/${id}`, ...)`) se omiten.
  • Solo receptores con nombres reconocibles: si el router se renombra (const myRouter = express.Router()myRouter.get(...) no es *Router), no se detecta.
  • Falsos positivos: app.use('/estatico', express.static(...)) se registra como ruta, y cualquier variable que cumpla el patrón de nombre (p. ej. userRouter.get(...)) aunque no sea Express.
  • Los comentarios (// app.get('/x')) se detectan como rutas.

Rutas NestJS (src/analyzer/nestscan.ts)

Detecta decoradores @Controller, @Get, @Post, @Put, @Patch, @Delete, @Options, @Head y @All con argumento literal, componiendo prefijo del controlador y subruta. Límites:

  • Los decoradores deben estar al inicio de línea (con solo espacios antes).
  • Argumentos de ruta solo literales: variables y template literals no se resuelven.
  • Las rutas de método sin un @Controller activo previo en el archivo se ignoran.
  • Con varios @Controller en un mismo archivo, cada ruta se atribuye al último prefijo vigente.

Variables de entorno (src/analyzer/envscan.ts)

Detecta process.env.NOMBRE y process.env['NOMBRE'] en código JS/TS. Límites:

  • No detecta destructuring (const { PORT } = process.env) ni acceso dinámico (process.env[nombre]).
  • Los comentarios que mencionan process.env.X cuentan como uso.
  • No lee archivos .env ni .env.example; solo detecta usos en el código.

Imports (src/analyzer/importscan.ts)

Detecta import, export ... from, import(...) y require(...) con comillas simples o dobles; resuelve specifiers relativos probando extensiones e index de carpeta. Límites:

  • No soporta specifiers con backticks ni imports multilínea (import {\n a \n} from '...').
  • Los comentarios con imports se detectan como imports reales.
  • Los specifiers de node_modules y los alias de tsconfig (@/...) quedan sin target resuelto.
  • Solo se escanean .js, .jsx, .ts, .tsx, .mjs y .cjs.

Escáner de estructura (src/analyzer/scanner.ts)

  • Lista fija de carpetas ignoradas (node_modules, .git, dist, build…): carpetas de dependencias con otros nombres sí se escanean.
  • No sigue symlinks: módulos montados por symlink quedan fuera del análisis.
  • Los archivos ocultos se omiten salvo .env.
  • El análisis es un snapshot estático: no hay watch ni análisis incremental.

Alcance

  • v0.1 analiza únicamente proyectos JavaScript y TypeScript.

Requisitos

  • Node.js 20 o superior.
  • npm 10 o superior.

Desarrollo

npm install
npm run electron:dev

El comando compila el proceso principal, inicia Vite en http://localhost:5173 y abre Electron con recarga en caliente.

Pruebas

La suite usa proyectos temporales aislados. No analiza ni modifica repositorios reales.

# Ejecutar una vez
npm test# Modo interactivo durante el desarrollo
npm run test:watch
# Verificar los tipos de las pruebas
npm run test:typecheck

La cobertura funcional actual incluye:

  • Árbol, conteos, orden y carpetas ignoradas.
  • Directorios inexistentes o sin permisos.
  • package.json raíz, paquetes anidados y JSON inválido.
  • Variables de entorno, agrupación y exclusiones.
  • Rutas Express y NestJS, métodos HTTP, composición de prefijos y falsos positivos.
  • Imports ES, require, re-exports, resolución de extensiones e index.
  • IDs, nodos, relaciones y deduplicación del grafo arquitectónico.
  • Integración completa mediante analyzeProject().
  • Progreso del análisis: fases, avance por archivo y rango monótono [0, 1].
  • Mapeo visual: ids estables, posiciones deterministas, regiones por tipo y colores.

Antes de proponer un cambio ejecuta:

npm run check

Este comando verifica tipos, ejecuta las pruebas y construye el renderer y Electron.

Build de producción

npm run electron:build

Genera los artefactos del sistema operativo actual en release/:

SistemaComandoArtefactos
Linuxnpm run electron:build.AppImage y .snap
Windowsnpm run electron:build (en Windows).exe (instalador NSIS y portable)
macOSnpm run electron:build (en macOS).dmg y .zip

Cada plataforma se compila en su propio sistema: Windows no se puede empaquetar desde Linux (requiere Wine) y macOS solo se empaqueta en macOS. El workflow .github/workflows/build.yml compila las tres plataformas en GitHub Actions y publica un release automáticamente al crear un tag v*. La firma se habilita configurando CSC_LINK/CSC_KEY_PASSWORD (macOS y Windows) en el CI.

En Linux, la primera vez que se ejecuta el AppImage la app se integra sola en el menú y el dock de GNOME (genera la entrada .desktop y el ícono en ~/.local/share).

Estructura

codeatlas/
├── electron/
│ ├── main.ts # Ventana, validación, IPC y ciclo de vida del worker
│ ├── analyzerWorker.ts # Ejecuta el análisis en worker_threads y reporta progreso
│ ├── preload.ts # API segura para el renderer
│ └── tsconfig.json
├── src/
│ ├── analyzer/
│ │ ├── scanner.ts # Árbol y package.json
│ │ ├── envscan.ts # Variables de entorno
│ │ ├── routescan.ts # Rutas Express
│ │ ├── nestscan.ts # Rutas NestJS (decoradores)
│ │ ├── importscan.ts # Imports y require entre módulos
│ │ ├── graph.ts # Grafo común y IDs estables
│ │ ├── types.ts # Contratos del análisis
│ │ └── index.ts # Orquestación
│ ├── editors/
│ │ └── registry.ts # IDEs soportados y builders de apertura
│ ├── components/
│ │ ├── TreeView.tsx
│ │ ├── GraphView.tsx # Lienzo React Flow y panel de detalles
│ │ ├── graphMapper.ts # Grafo del análisis → React Flow
│ │ └── graphLabels.ts # Etiquetas y colores por tipo
│ ├── App.tsx
│ └── main.tsx
├── tests/
│ ├── analyzer/ # Pruebas unitarias e integración
│ ├── graphview/ # Pruebas del mapeo visual
│ └── helpers/ # Fixtures temporales
├── tsconfig.json # Renderer
├── tsconfig.test.json # Pruebas
├── vite.config.mts
└── vitest.config.mts

Arquitectura

El renderer no accede directamente a Node.js. preload.ts expone una API mínima mediante contextBridge, el proceso principal valida las entradas IPC y el analizador usa únicamente APIs de Node (fs y path).

El análisis corre en un hilo aparte (electron/analyzerWorker.ts, vía worker_threads): el proceso principal valida la ruta, lanza el worker y reenvía al renderer los eventos de progreso por IPC; el renderer no se congela aunque el proyecto sea grande.

ArchitectureGraph es un modelo de dominio serializable e independiente de React Flow. Sus IDs y rutas están normalizados para que el mismo análisis sea estable en distintos sistemas operativos. graphMapper.ts convierte el modelo en nodos y aristas de React Flow con posiciones deterministas, y GraphView.tsx lo renderiza en el mapa interactivo de módulos.

Esta separación permite mover el análisis a un worker o sustituir el motor en el futuro sin reescribir la interfaz.

Contribuir

Consulta CONTRIBUTING.md antes de abrir un pull request.

About

CodeAtlas escanea tu proyecto y genera un mapa interactivo de su arquitectura, dependencias, rutas y más. Deja de adivinar, empieza a entender..

Resources

Contributing

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages