Aunque el pueblo que exploras parezca antiguo y lleno de magia, detrás de él hay un taller moderno y bien afinado. El desarrollo de este juego web combina herramientas actuales que permiten una creación ágil, flexible y potente. Hoy te cuento cómo funciona por dentro.
📦 npm: organizando el proyecto como un artesano digital
Utilizo npm (Node Package Manager) para manejar todas las dependencias del proyecto. Gracias a npm puedo:
- Instalar librerías como
three,enable3d,firebasey utilidades para depuración o animación. - Mantener actualizado el entorno con versiones controladas.
- Ejecutar scripts para compilar, lanzar el servidor de desarrollo o construir la versión final del juego.
Todo el código se estructura como un proyecto de frontend moderno, con package.json como centro de control.
⚡ Vite: desarrollo ultrarrápido y con recarga instantánea
Para servir el juego en desarrollo, uso Vite, una herramienta ligera y moderna creada para reemplazar a Webpack en muchos casos. ¿Qué ventajas me da?
- Arranque casi instantáneo del servidor de desarrollo (cold start).
- Hot Module Replacement (HMR): puedo modificar el código y ver los cambios en el navegador sin recargar.
- Optimización automática de dependencias.
Con Vite puedo trabajar con JavaScript moderno y módulos ES sin problemas, lo que me permite iterar muy rápido mientras construyo escenas, corrigo físicas o ajusto sonidos.
🖥️ XAMPP: el backend clásico para los datos persistentes
Aunque el frontend está en JavaScript puro, el backend usa PHP con XAMPP. ¿Por qué? Porque necesito:
- Servir archivos dinámicos.
- Almacenar datos del jugador en archivos o bases de datos cuando no uso Firebase (por ejemplo, preferencias locales, progreso narrativo, etc.).
- Ejecutar pequeños scripts personalizados en el servidor local.
XAMPP me da un entorno Apache + PHP fácil de arrancar y sin complicaciones, ideal para probar interacciones sin desplegar todo en producción.
🔧 Un entorno equilibrado
Este trío de herramientas —npm + Vite + XAMPP— me permite desarrollar con rapidez, probar en tiempo real y gestionar tanto el frontend moderno como el backend clásico. Todo ello sin perder la flexibilidad de modificar el juego escena a escena.
“Detrás de cada dragón hay un terminal abierto, una consola depurando y un servidor rugiendo.”
En el próximo artículo te enseñaré cómo organizo los assets, modelos y sonidos para mantener el proyecto limpio y escalable.
