Acerca de WebDev-Tools

Sí, lo sé. La colección de herramientas número 10 000 en Internet. ¿Quién la necesita? Pero puedo tranquilizaros: este proyecto nunca fue planeado. Es un accidente, un producto de la procrastinación y una lección sobre el manejo de la inteligencia artificial.

Todo comenzó de forma inocente en mi escritorio.

Al principio fue el script.

Como muchos desarrolladores, yo también tenía algunas herramientas propias guardadas en mi localhost. Pequeños scripts para las molestias cotidianas: una conversión de Em/Px aquí, una pequeña ayuda allá. Cosas para las que era demasiado vago como para buscar y abrir siempre los mismos sitios web. Y es que estoy en guerra absoluta con los marcadores.

Estas pequeñas ayudas cumplían su función. Pero entonces añadí dos más. Y entonces sucedió: mi instinto de desarrollador web se activó.

Instintivamente, empecé a vincularlas entre sí. Necesitaba un menú. Y un poco de estilo. Y todo lo que se te ocurre cuando quieres distraerte del trabajo real. Así, una simple colección de scripts se convirtió en un proyecto en toda regla. Tenía que «tunearlo» hasta tener una pequeña página web con todo lo necesario.

«¡IA, hazlo tú!» ¿Una idea descabellada?

En algún momento se me ocurrió la idea: solo son scripts sencillos. ¡Deja que lo haga la IA! Como fiel usuario de VS Code, puse en marcha el proyecto directamente con Claude Sonnet 4.5 (en GitHub CoPilot).

Me sorprendió, porque el resultado fue una aplicación web modular ampliable sorprendentemente buena.

Por supuesto, no fue tan fácil. Hay que evitar constantemente que la IA se exceda. Mi comando más importante se convirtió rápidamente en: «¡No, no necesitamos ningún gestor de paquetes! ¡Y ahora deja de intentar sugerirme otro marco de trabajo!».

Al final, sin embargo, se obtuvo una estructura básica realmente útil.

Las dificultades del «vibe coding» con IA

El proyecto cobró impulso y rápidamente aprendí algunas lecciones difíciles sobre la colaboración con mis nuevos compañeros digitales.

La cuestión del marco: las IA prefieren trabajar con Tailwind. Y así lo hicieron aquí. Tras algunos ajustes manuales, en los que mi paciencia se fue agotando poco a poco, finalmente se agotó. Sin pensarlo dos veces, me pasé a Bootstrap para terminar la colección de forma rápida y pragmática. A veces, «terminado» es simplemente mejor que «perfecto» (o «Tailwind»).

2. ¿Sin Git? ¡Sin mí! Por pura costumbre, creé directamente un repositorio Git. ¡Por suerte! Rápidamente me di cuenta de que lo que estaba haciendo, ese «vibe coding» sin planificar con la IA, sin Git suponía una considerable pérdida de tiempo.

3. Las trampas de la lógica de la IA: el mayor problema es que a las IA les gusta facilitarse la vida, pero de la manera equivocada.

• Especulan: en lugar de analizar lo que realmente se pretende, a menudo adivinan al azar. Hay que poner fin rápidamente a esta especulación y darles instrucciones precisas en cada paso, de lo contrario se acaba en el caos.
• Les encantan sus propios scripts. Tienden a proponer sus propios scripts o soluciones, lo que a menudo conduce a resultados desastrosos. En no pocos casos, esto habría requerido un reinicio completo del proyecto, si no hubiera sido posible un valiente «git reset --hard».

4. Ping-pong de IA en las revisiones de código También he apostado por la IA en el control de calidad, pero de forma sistemática: primero dejé que GPT-5 Codex realizara las revisiones de código y luego pedí la opinión de Claude Sonnet 4.5 al respecto. Una revisión de IA para la revisión de IA, por así decirlo. Es bastante meta, pero extremadamente útil para contrastar diferentes «formas de pensar».

Ronda extra: ¿la IA como traductora?

Una vez que la funcionalidad estuvo lista, pensé en las traducciones. Primero le tocó el turno a Claude Sonnet 4.5. Según sus propias declaraciones, la IA domina el inglés y el alemán a nivel nativo y ofrece una seguridad del 98 % en español, francés, italiano y portugués.

La cosa se puso interesante cuando pregunté por el hindi, el chino o el japonés. En este caso, la IA admitió que necesitaba ayuda externa, como DeepL. Y lo que es más importante, señaló por sí misma que no se trata solo de una traducción burda, sino que también hay que tener en cuenta las peculiaridades culturales y las formas de cortesía.

Un refrescante grado de autorreflexión. Sin embargo, para la traducción por lotes propiamente dicha de la parte estática y codificada de las lenguas románicas, Claude me pareció demasiado intelectual. En su lugar, dejé que GPT-5-Codex se encargara de ello. Una vez más, la herramienta adecuada para el trabajo adecuado.

De la intranet a la web salvaje

Una vez que la colección de herramientas estuvo lista (e incluso disponible en varios idiomas), estuvo disponible durante bastante tiempo solo en nuestra red corporativa y nos prestó un buen servicio.

En algún momento pensé: ¿por qué no? Así que la ordené y la hice pública.

Y como todo esto surgió a raíz de un «accidente», el código es completamente abierto. Si quieres participar en su desarrollo o encuentras algún error, aquí tienes el repositorio Git: https://github.com/RamonKaes/WebDev-Tools.

Sí, lo siento. Ahora está aquí. La colección de herramientas número 10 000. Pero bueno, al menos tiene una historia detrás. :D

¡Que lo disfrutes!

Ramon