Horas perdidas por una coma (y otros clásicos)

El código no funcionaba. No había errores en la consola. Reinicié el servidor. Borré la caché. Y todo era por un simple carácter mal puesto.

HumorDebugDevLife

El Problema (Para Todos)

Esto nos ha pasado a todos. Tienes un código que *debería* funcionar. Lógicamente, es perfecto. No hay errores rojos en la consola, la aplicación arranca... pero simplemente no hace lo que esperas.

En mi caso, fue creando esta misma sección de blog. Añadí un artículo, cree su archivo, lo enlacé... y al hacer clic: Error 404 - Página no encontrada.

Empezó la locura: ¿Está mal la caché del servidor? (rm -rf .next). ¿Es Turbopack? (npm run dev sin turbopack). ¿Está mal la ruta en el componente Link? Revisé todo 10 veces. Todo parecía correcto.

El sentimiento: "He probado todo. No tiene sentido. ¿Quizás es un bug de Next.js? ¿De React? No puede ser mi código..."

La Solución (La Coma)

Después de horas de frustración, volví a mirar el nombre de la carpeta que había creado. Y ahí estaba.

El nombre de mi carpeta era: arreglando-el-bug-de-swiper,

Una coma. Una simple coma al final del nombre de la carpeta. Un error de "typo" al crearla.

El sistema de archivos la incluía en el nombre, pero el sistema de rutas de Next.js (lógicamente) no la esperaba. El enlace en mi componente (`/arreglando-el-bug-de-swiper`) no coincidía con el nombre real de la carpeta (`/arreglando-el-bug-de-swiper,`), y por eso daba 404.

Quité la coma. Refresqué la página. Funcionó al instante.

La Lección Aprendida

El 99% de las veces, el error es tuyo (y es una tontería). Antes de culpar a la caché, al framework o a Turbopack, asume que has cometido el error más simple posible. Un typo, una coma, un ; que falta, un == en lugar de ===. Es la navaja de Ockham de la programación.