The latest articles on DEV Community by Ronnie Portales (@quetzacoll12). https://dev.to/quetzacoll12 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1489378%2F801b47a1-42c2-4e10-a410-08282b962ee2.jpg https://dev.to/quetzacoll12 en Ronnie Portales Sun, 12 Jul 2026 23:42:35 +0000 https://dev.to/quetzacoll12/construyendo-moxie-gotchi-arena-v50-la-pasion-del-futbol-hecha-arquitectura-segura-49oo https://dev.to/quetzacoll12/construyendo-moxie-gotchi-arena-v50-la-pasion-del-futbol-hecha-arquitectura-segura-49oo <p><em>This is a submission for <a href="https://dev.to/challenges/weekend-2026-07-09">Weekend Challenge: Passion Edition</a></em></p> <h2> What I Built </h2> <p>Construí <strong>Moxie-Gotchi Arena v5.0 (Edición Pasión y Rivalidad Mundialista)</strong>. Es un videojuego de simulación estratégica web inspirado en la devoción, el espíritu de equipo y la obsesión sana que genera el fútbol durante la Copa del Mundo. </p> <p>El proyecto transforma el ciclo clásico de cuidado y combate RPG en la gestión real de un club: controlas la energía física de tus jugadores, diseñas jugadas de pizarrón en el entrenamiento técnico, manejas el fervor de tu hinchada y compites en la cancha contra tu "Rival Clásico" en derbis de alta presión. El objetivo principal fue demostrar que un juego web adictivo y pasional puede estar respaldado por una arquitectura de software limpia y altamente segura.</p> <h2> Demo </h2> <p>El proyecto se ejecuta de forma local de manera desacoplada. Puedes ver la interfaz del estadio interactivo, la barra de táctica en tiempo real y la consola del VAR integrada directamente en el repositorio de código adjunto abajo.</p> <h2> Code </h2> <p>Puedes revisar todo el código fuente, la base de datos relacional y los scripts en mi repositorio público de GitHub:</p> <p>👉 <a href="https://github.com/quetzacoll12/moxie-gotchi-arena-passion" rel="noopener noreferrer">moxie-gotchi-arena-passion en GitHub</a></p> <h2> How I Built It </h2> <p>Para hacerle honor a los "proyectos nocturnos hechos con pasión", estructuré el sistema utilizando una arquitectura <strong>Cliente-Servidor</strong> completamente independiente:</p> <ol> <li> <p><strong>El Backend (El Corazón Táctico):</strong> Construido en <strong>Python</strong> con <strong>FastAPI</strong> y <strong>SQLite3</strong>. Decidí delegar toda la lógica crítica y de persistencia relacional al servidor para implementar un sistema hermético de <strong>Validación en el Lado del Servidor (Server-Side Validation / Anti-Cheat)</strong>:</p> <ul> <li> <strong>Cálculo de Estados:</strong> Las recuperaciones en el vestuario curan exactamente el 30% ($HP_{heal} = \lfloor HP_{max} \times 0.30 \rfloor$). Este valor se calcula consultando la base de datos en Python, impidiendo que un usuario altere su vida modificando el código desde la consola del navegador (<code>F12</code>).</li> <li> <strong>Persistencia Temporal contra F5:</strong> Los 5 minutos de espera requeridos entre partidos (charla técnica) se controlan mediante marcas de tiempo UNIX guardadas en SQLite. Si el jugador refresca la página para saltarse el tiempo, el backend detecta los milisegundos restantes y bloquea la petición asíncrona devolviendo un código <code>400 Bad Request</code>.</li> </ul> </li> <li><p><strong>El Frontend (La Grada Interactiva):</strong> Diseñado con HTML5, CSS3 con una estética oscura y vibrante de estadio de fútbol, y <strong>JavaScript asíncrono</strong> nativo utilizando la API <code>fetch</code> para comunicarse con el VAR (backend) sin recargar la pantalla.</p></li> </ol> <h2> Prize Categories </h2> <p>Al ser un desarrollo nativo enfocado puramente en la arquitectura de seguridad backend con Python y bases de datos relacionales, me postulo a la categoría general del desafío técnico de fin de semana para proyectos impulsados por la pasión por el software.</p> devchallenge weekendchallenge