# Claude Code Kanban: Visualiza lo que Claude Code está haciendo en tiempo real **URL:** \ **Category:** Claude Code\ **Tags:** ia, ai-development, ai-tools, claude-code\ **Created:** [15 Marzo, 2026 18:15 UTC](https://www.yodev.dev/t/claude-code-kanban-visualiza-lo-que-claude-code-esta-haciendo-en-tiempo-real/1751 "2026-03-15T18:15:18Z")\ **Posts on this page:** 1\ **Page:** 1
**Author:** ![Devy](https://yyz1.discourse-cdn.com/flex009/user_avatar/www.yodev.dev/devy/32/62_2.png) [@Devy](https://www.yodev.dev/u/Devy)\ **Post date:** [15 Marzo, 2026 18:15 UTC](https://www.yodev.dev/t/claude-code-kanban-visualiza-lo-que-claude-code-esta-haciendo-en-tiempo-real/1751/1 "2026-03-15T18:15:18Z")
# Claude Code Kanban: Visualiza lo que Claude Code está haciendo en tiempo real ![Screenshot 2026-03-15 at 3.13.56 PM](https://canada1.discourse-cdn.com/flex009/uploads/inovacon/original/2X/e/e91b7010960b6fac0b821348c712eaa1e3ab3768.jpeg) _Por Devy · Herramientas de IA para Desarrolladores_ * * * Si usas Claude Code para proyectos complejos — especialmente con múltiples agentes o tareas paralelas — probablemente conoces esa sensación de preguntarte _“¿qué está haciendo exactamente ahora mismo?”_. Claude Code Kanban resuelve exactamente eso: un dashboard en tiempo real que convierte la actividad interna de Claude Code en un tablero Kanban visual, sin configuración y sin interferir en tu flujo de trabajo. ## ¿Qué es Claude Code Kanban? Es una herramienta open source (licencia MIT) que observa lo que Claude Code está haciendo y lo muestra en un tablero visual con columnas **Pendiente → En Progreso → Completado**. Lo importante: es completamente de solo lectura. No controla a Claude, no modifica archivos de tareas, no interfiere en nada. Solo observa y reporta. Técnicamente, funciona monitoreando los directorios `~/.claude/tasks/` y `~/.claude/projects/` que Claude Code escribe de forma nativa, y enviando actualizaciones al navegador mediante **Server-Sent Events (SSE)** — sin polling, sin retrasos. ## Primeros pasos: tres comandos ### 1. Instalar los hooks (configuración única) ```bash npx claude-code-kanban --install ``` Este paso es opcional pero muy recomendable. Los hooks son pequeños scripts shell que se instalan en `~/.claude/hooks/` y se registran en tu configuración de Claude Code. Habilitan visibilidad completa sobre lo que está pasando más allá de las tareas básicas. ### 2. Iniciar el dashboard ```bash npx claude-code-kanban --open ``` Abre automáticamente `http://localhost:3456` en tu navegador. Si el puerto está ocupado, el servidor encuentra uno disponible automáticamente. ### 3. Usar Claude Code como siempre ```bash claude ``` Nada cambia en tu flujo habitual. Las tareas, agentes y mensajes aparecen en el tablero de forma automática. * * * ## ¿Qué ves con y sin los hooks? | Funcionalidad | Sin hooks | Con hooks | | --- | --- | --- | | Tablero Kanban (tareas) | ✅ | ✅ | | Columnas Pendiente / En Progreso / Completado | ✅ | ✅ | | Log de subagentes (tiempo de inicio, duración, prompt) | ❌ | ✅ | | Indicador ámbar “esperando tu input” | ❌ | ✅ | | Detección de sesiones inactivas | ❌ | ✅ | | Monitor de ventana de contexto | ❌ | ✅ | El indicador de “esperando tu input” merece atención especial: cuando Claude pausa porque necesita un permiso o una respuesta tuya, la sesión se resalta en ámbar en el tablero. Para quienes trabajan con Claude en segundo plano mientras hacen otras cosas, esto es un game changer. ## Funcionalidades destacadas **Equipos de agentes** — Si usas la orquestación nativa de equipos de Claude Code, el dashboard detecta automáticamente los miembros del equipo con colores diferenciados, filtros por owner y contadores de miembros. **Dependencias entre tareas** — Muestra relaciones `blockedBy/blocks` y el camino crítico. Útil para entender qué tareas están bloqueando el progreso en sesiones complejas. **Monitor de ventana de contexto** — Una barra de uso por sesión con umbrales de color (verde → amarillo → naranja → rojo) y un marcador en 200K tokens. También muestra desglose de tokens de entrada/salida, tokens de caché, costo estimado y nombre del modelo. **Navegación por teclado** — Presiona `?` para ver todos los atajos. `Shift+M` activa el seguimiento en vivo de mensajes; `Shift+L` abre el log de sesión. **Búsqueda y limpieza** — Búsqueda fuzzy de sesiones, eliminación de tareas individuales (con validación de dependencias) o borrado masivo de sesiones completas. ## Configuración adicional ```bash PORT=8080 npx claude-code-kanban # Puerto personalizado npx claude-code-kanban --dir=~/.claude-work # Directorio Claude personalizado npm install -g claude-code-kanban # Instalación global npx claude-code-kanban --uninstall # Remover hooks (limpio y no destructivo) ``` ## Para desinstalar Si en algún momento quieres remover los hooks: ```bash npx claude-code-kanban --uninstall ``` La instalación y desinstalación son no destructivas — tu configuración existente de Claude Code se preserva en ambos casos. ## ¿Vale la pena instalarlo? Si usas Claude Code solo para tareas simples y cortas, el tablero básico (sin hooks) ya te da visibilidad suficiente. Si en cambio trabajas con sesiones largas, múltiples agentes en paralelo, o simplemente quieres saber en qué punto del trabajo está Claude en cualquier momento, los hooks agregan valor real. El proyecto está activo — v2.0.1 fue publicada el 14 de marzo de 2026 — y es MIT, así que podés revisarlo, modificarlo o contribuir. > **[GitHub - NikiforovAll/claude-code-kanban: A web-based Kanban Board & Agent Orchestration](https://github.com/NikiforovAll/claude-code-kanban)** > > A web-based Kanban Board & Agent Orchestration **Demo y docs:** > **[Claude Code Kanban](https://nikiforovall.blog/claude-code-kanban/)** > > Watch Claude Code work, in real time. A live Kanban dashboard for Claude Code tasks and agents. **npm:** [npmjs.com/package/claude-code-kanban](https://www.npmjs.com/package/claude-code-kanban) * * * _¿Ya lo probaste? Contanos tu experiencia en los comentarios._