Sin LLM, hacer un juego toma 3 meses; con LLM, 3 días

• Un ingeniero de software con 15 años de experiencia comparte su experiencia de desarrollar en Go un juego de cartas de su infancia
• Al desarrollar “Truco” sin LLM (modelo de lenguaje grande), resolvió manualmente todos los problemas, como el diseño de la UI y el despliegue serverless, y le tomó 3 meses
• Al crear “Escoba”, usó un LLM para convertir código de backend y acelerar mucho la implementación, y la mayor parte funcionó desde el primer prompt
• En la parte final del artículo ofrece una guía paso a paso para que cualquiera pueda crear un juego, usando un ejemplo de Tic-Tac-Toe con backend en Go, conversión a WASM e integración con React
• Aun así, el frontend en React y la gestión del estado del juego basada en WASM siguen requiriendo depuración e implementación manuales

---

Introducción

• Un ingeniero de software con 15 años de experiencia se dio cuenta de que en realidad nunca había creado ni desplegado un juego por su cuenta
• Decidió desarrollar en Go uno de los juegos de cartas que disfrutaba con sus amigos en Argentina cuando era niño

Truco: 3 meses sin LLM

• El 18 de junio de 2024 empezó a desarrollar el juego de cartas Truco con un backend en Go. Escribió el frontend con apenas conocimientos mínimos de React
• La implementación de la UI fue el mayor desafío y, para evitar ofrecer un servidor, usó TinyGo para transpilar a WASM (WebAssembly) y luego desplegó los archivos estáticos en GitHub Pages
• Como no tenía LLM en ese momento, tuvo que investigar cada detalle por su cuenta y avanzar a prueba y error durante unos 3 meses hasta terminarlo
• No lo hizo con fines publicitarios ni de monetización, sino solo con el objetivo de completar el juego, y sigue jugándose de forma constante incluso 1 año después de su lanzamiento
  • Jugar Truco: https://marianogappa.github.io/truco-argentino
  • Backend (Golang): https://github.com/marianogappa/truco
  • Frontend (React): https://github.com/marianogappa/truco-argentino

Escoba: 3 días con LLM

• Un año después, durante una visita a Argentina para ver a su familia, le enseñó a su sobrino Escoba, el segundo juego de cartas más popular
• Esta vez usó LLM (Claude): duplicó el backend de Truco, explicó las reglas de Escoba en el prompt y pidió refactorizar el código
• Casi quedó perfecto desde el primer prompt, y solo tuvo que corregir manualmente algunos bugs menores y agregar funciones adicionales
• El frontend sí requirió varios días de implementación y depuración manual. Las limitaciones del LLM, sus habilidades con React y el entorno particular de manejar el estado del juego en WASM fueron factores desafiantes
  • Jugar Escoba: https://marianogappa.github.io/escoba-de-15
  • Backend (Golang): https://github.com/marianogappa/escoba
  • Frontend (React): https://github.com/marianogappa/escoba-de-15

Paso a paso: cómo crear tu propio juego

• Presenta una guía práctica mínima y código de ejemplo para que cualquiera pueda intentar desarrollar su propio juego
• Ofrece un repositorio de ejemplo de Tic-Tac-Toe que se puede usar como base mediante un fork
  • Backend: https://github.com/marianogappa/tictactoe-backend
  • Frontend: https://github.com/marianogappa/tictactoe-frontend
  • Demo: https://marianogappa.github.io/tictactoe-frontend/

Desarrollo del backend

• En un backend por turnos, las funcionalidades pueden diseñarse con claridad
• Mantener una arquitectura serverless y evitar una estructura donde personas jueguen entre sí es una decisión realista si no se cuenta con un servidor comercial

Desarrollo del frontend

• El frontend necesita realizar tareas como las siguientes
  • Solicitar al backend la creación de un nuevo GameState
  • Mostrar el estado en la UI
  • Proveer una interfaz para elegir acciones válidas
  • Enviar comandos al backend al aplicar una acción
  • Pedir al backend el turno del bot cuando corresponda

Conversión del backend a WASM

• Para compilar código Go a WASM, se usa GOARCH=wasm GOOS=js go build
• Puede haber problemas por el gran tamaño del binario, así que usa TinyGo para reducirlo
• Para exportar las funciones que se conectarán con el frontend, escribe en Go un punto de entrada separado (por ejemplo, main_wasm.go) y lo maneja con bifurcación en el proceso de build
• En la función principal hace falta bloquear con select {} para evitar que el programa termine de inmediato

Integración de datos entre backend y frontend

• Los structs de forma libre de Go, como GameState, no pueden serializarse/deserializarse directamente en WASM
• Es necesario intercambiar todos los datos en formato JSON
• Siguiendo la documentación de TinyGo, tanto la entrada como la salida se manejan mediante serialización JSON

Interfaz entre frontend y backend

• En el frontend se llaman directamente las funciones del backend
• GameState se administra solo dentro de WASM y el frontend no puede mutarlo; el backend es siempre la fuente de verdad
• Después de recompilar WASM hay que reemplazar el archivo, y se muestra un ejemplo de automatización mediante Makefile

Entorno de ejecución de WASM

• Para ejecutarlo, hay que incluir wasm_exec.js en el head, y usar ese script para crear la instancia y ejecutarla

Conclusión

• Hacer juegos fue una experiencia divertida, y la combinación de Go, WASM y React es un enfoque que cualquiera puede intentar
• La ayuda de los LLM mejoró mucho la productividad, pero las habilidades de frontend y la experiencia depurando siguen siendo importantes
• Cualquiera puede animarse a desarrollar su propio juego con esta estructura, así que vale la pena intentarlo