Una interfaz web práctica para el agente de IA de consola pi
Trabajar en la terminal es genial mientras el contexto cabe en una pantalla. El agente de codificación de consola pi es excelente para ediciones rápidas, pero una sesión de depuración de una hora se convierte en un caos de llamadas a funciones, código generado y mensajes de error. Buena suerte encontrando el punto en ese flujo donde el modelo se desvió, o recordando qué archivo estaba editando hace veinte minutos.
El desarrollador agegr resolvió este problema de una manera muy práctica: escribió un shell web local llamado pi-web. La herramienta lee los archivos de registro del agente pi y genera un práctico panel visual en el navegador.
Qué es pi-web y cómo funciona
En su esencia, pi-web es un wrapper alrededor del agente de consola pi. En lugar de reescribir el agente en sí, el autor creó un frontend que analiza archivos .jsonl del directorio ~/.pi/agent/sessions.
La aplicación se ejecuta completamente en local. Puedes iniciarla sin ninguna instalación previa con un solo comando:
npx @agegr/pi-web@latest
El servidor se iniciará en el puerto 30.141 y abrirá automáticamente una pestaña en el navegador. Si el puerto está ocupado o necesitas acceso solo local, los parámetros se cambian fácilmente mediante flags:
pi-web --port 8080 --hostname 127.0.0.1
Qué cambia en el flujo de trabajo
El problema principal de los diálogos de IA en consola es la pérdida de estructura. En la terminal, todo parece un muro sólido de texto. La interfaz web descompone la misma sesión en bloques visuales claros.
Ramificación visual de sesiones
Cuando el agente de IA comienza a llegar a callejones sin salida, en la consola tienes que reiniciar el diálogo o generar un largo historial de intentos de reintento. Pi-web tiene dos caminos para experimentación segura:
- Fork crea un archivo de sesión
.jsonlseparado. Puedes tomar un nuevo camino mientras conservas el resultado anterior. - Editar desde un mensaje seleccionado crea una rama adicional dentro de la misma sesión.
Visualización de archivos junto al chat
Mientras el agente edita código o escribe documentación, puedes seguir los cambios directamente en el panel adyacente. El explorador de proyectos está a la izquierda, y el área de vista previa a la derecha. El visor integrado muestra no solo archivos fuente y diffs. Maneja imágenes, audio, PDFs y documentos DOCX con facilidad.
Control transparente de tokens y configuración
La barra superior muestra los tokens gastados, el costo de la sesión y el estado de compresión del contexto. No más adivinar cuánto de tus límites se han usado y qué prompt del sistema está activo en este momento.
La gestión del modelo y la clave API también se ha movido de archivos JSON de consola a una interfaz gráfica. A través de los paneles de configuración, puedes cambiar el modelo predeterminado, probar conexiones y activar o desactivar habilidades del agente.
Soporte para Git worktrees
Si usas Git worktrees para trabajo paralelo en múltiples ramas, la barra lateral de pi-web puede cambiar entornos sobre la marcha. El explorador de archivos y las nuevas sesiones se adaptan automáticamente al checkout seleccionado.
Cómo está diseñada la arquitectura
El proyecto está escrito en TypeScript usando el framework Next.js. La estructura del repositorio es simple y directa.
La carpeta app/api contiene endpoints para trabajar con el agente:
agent/maneja el lanzamiento de sesiones y la transmisión de eventos mediante Server-Sent Events (SSE).files/maneja la lectura de archivos, diffs y seguimiento de cambios.models-config/yskills/gestionan las configuraciones del agente.
La seguridad está manejada por el módulo lib/file-access.ts. Restringe el gestor de archivos al proyecto actual y los directorios involucrados en la sesión. No podrás leer un archivo aleatorio del sistema a través de la interfaz.
A quién le será útil este proyecto
Si usas activamente el agente de codificación pi, definitivamente deberías probar pi-web. El proyecto resuelve el problema principal de las herramientas CLI: la falta de claridad visual.
La interfaz se vuelve especialmente práctica en dos casos:
- Cuando depuras tareas complejas que requieren volver frecuentemente a pasos anteriores y comparar variantes de solución.
- Cuando trabajas con archivos multimedia y documentación, cuando la capacidad de previsualizar resultados rápidamente en el navegador ahorra tiempo.
La herramienta está en desarrollo activo: ya tiene más de 16.000 estrellas en GitHub y commits recientes. Solo necesitas Node.js y el agente pi instalado para ejecutarlo, así que la configuración literalmente tomará un par de minutos.
Proyectos relacionados