brainax

Bugs: leer el error

Lección 21 de 26 del curso «Vibe coding». Gratis, con animaciones y un test.

Dónde viven los errores

Un bug es un error en un programa. Ejemplo: en tu registro de entrenamientos tocas «Guardar» y no pasa nada. Los errores se esconden en tres lugares. La Console en DevTools, las herramientas de desarrollo del navegador (F12 en Windows, Cmd+Option+I en Mac): líneas rojas del código de la página. La pestaña Network, en el mismo lugar: todas las peticiones de la página al servidor. Y los logs del hosting: el registro de lo que hicieron el servidor y el build.

Network y códigos de respuesta

Abres Network, tocas «Guardar» y ves la línea del esquema: «POST /api/save 500». POST es una petición que envía datos. /api/save es una dirección en tu servidor. 500 es el código de respuesta. Chuleta: 200 todo bien, 404 no encontrado (dirección equivocada), 401 y 403 sin acceso (no iniciaste sesión o no tienes permiso), 500 error del servidor. O sea, el botón no tiene la culpa: revisa los logs del servidor.

Receta: del bug al arreglo

Paso 1: reproduce el bug a propósito y anota los pasos. Paso 2: copia el error completo, de la consola o de los logs. Paso 3: dale al agente el error, los pasos y lo que esperabas. Paso 4: escribe «primero explica la causa, no toques el código todavía». Paso 5: el arreglo y tu propia prueba. Paso 6: commit. Lo del error completo salió en la lección sobre cómo darle tareas a la IA; aquí va el ciclo entero.

Trampa: «arreglar» borrando

Un agente puede «arreglar» un bug quitando lo que estorba. Ejemplo: al guardar fallaba la verificación de que el usuario inició sesión. El agente borra esa verificación. El error desaparece, pero ahora cualquiera escribe en los entrenamientos de otros. Igual, a veces los agentes borran un test que falla o esconden el error. Revisa el diff: la línea roja «¿verificación eliminada?» del esquema es la señal para preguntar «¿por qué?».

¿Atascado en bucle? Vuelve atrás

Quinto intento y solo empeoró: el agente arregla una cosa y rompe otra. Alto. Vuelve al último commit que funcionaba, como la flecha «volver atrás» del esquema. Abre una sesión nueva: la vieja está llena de intentos fallidos y el agente se enreda en ellos. Describe la tarea de nuevo y más pequeña: no «arregla el guardado», sino «guarda un entrenamiento con fecha». Un paso pequeño se arregla más rápido.

Ponte a prueba

  1. En Network ves «POST /api/save 500». ¿Qué significa?
    Respuesta correcta: Error en el servidor: revisa sus logs. El código 500 indica un error del lado del servidor. 404 sería una dirección equivocada, 401 o 403 un problema de acceso.
  2. ¿Qué conviene escribirle al agente sobre un bug?
    Respuesta correcta: El error completo, los pasos y lo que esperabas. Con el error completo, los pasos y lo esperado, el agente ve qué se rompió y cómo debería ser. Con «no funciona» solo puede adivinar.
  3. El agente «arregló» un bug borrando la verificación de sesión. ¿Qué haces?
    Respuesta correcta: Vuelvo atrás y pido la causa real. Sin la verificación de sesión, cualquiera puede escribir en datos ajenos. El error se fue, pero el problema empeoró: hace falta la causa, no quitar la protección.

← Contexto: archivo de reglas y MCP Revisión: no le creas a la primera →