About arc42
arc42, the template for documentation of software and system architecture.
Template Version 8.2 EN. (based upon AsciiDoc version), January 2023
Created, maintained and © by Dr. Peter Hruschka, Dr. Gernot Starke and contributors. See https://arc42.org.
1. Introducción y Metas
Y es un juego de tablero abstracto para dos personas, jugado sobre un tablero triangular formado por casillas hexagonales. El objetivo es que, por turnos, cada jugador coloque fichas de su color hasta conseguir una cadena conectada de sus fichas que toque los tres lados del triángulo.Para lograr este objetivo se ha propuesto una solucion que consta de dos partes:
-
Una aplicación Web que ofrecerá a los usuarios la posibilidad de jugar a diferentes juegos Y, que estará implementada en Typescript. Esta aplicación también ofrecerá un API externo que permitirá que sea utilizada por bots.
-
Un módulo implementado en Rust que permitirá chequear si una partida ha sido ganada o no, así como sugerir el siguiente movimiento. Este módulo ofrecerá un interfaz de servicio web básico para que pueda ser invocado por la aplicación web.
1.1. Vista general de los requisitos
Construir una plataforma web para jugar partidas del juego Y con soporte de usuarios, historial y una API para bots, apoyada por un módulo de lógica en Rust para validar formato YEN y verificar victoria.
1.1.1. MÓDULO 1: APLICACIÓN WEB (TYPESCRIPT)
RF01 - Gestión de Usuarios.
-
RF01.1: El sistema permitirá el registro de nuevos usuarios con email y contraseña.
-
RF01.2: El sistema permitirá el inicio de sesión de usuarios registrados.
-
RF01.3: El sistema mantendrá sesiones activas del usuario durante el uso.
-
RF01.4: El sistema permitirá a los usuarios cerrar sesión.
RF02 - Interfaz de Juego
-
RF02.1: El sistema proporcionará una interfaz web interactiva para jugar partidas de juegos tipo Y.
-
RF02.2: La interfaz mostrará el tablero de juego actualizado en tiempo real.
-
RF02.3: El sistema permitirá a los usuarios realizar movimientos mediante clics en el tablero.
-
RF02.4: La interfaz mostrará el turno actual del jugador.
-
RF02.5: El sistema notificará visualmente el resultado de la partida (victoria/derrota/empate).
RF03 - Historial de Partidas
-
RF03.1: El sistema almacenará el historial de partidas completadas por cada usuario.
-
RF03.2: El sistema permitirá a los usuarios consultar sus partidas anteriores.
-
RF03.3: El sistema mostrará estadísticas básicas
-
RF03.3.1: El sistema mostrará las partidas ganadas
-
RF03.3.2: El sistema mostrará las partidas perdidas
-
RF03.3.3: El sistema mostrará las partidas empatadas
-
RF03.3.4: El sistema mostrará el tiempo total de juego
-
RF04 - API Externa para Bots
-
RF04.1: El sistema expondrá una interfaz para permitir la integración con bots
-
RF04.2: La API requerirá autenticación para las peticiones de los bots.
-
RF04.3: La API permitirá crear nuevas partidas como bot.
-
RF04.4: La API permitirá realizar movimientos en partidas existentes.
-
RF04.5: La API devolverá el estado actual de la partida en formato YEN.
1.1.2. MÓDULO 2: MÓDULO DE LÓGICA (RUST)
RF05 - Verificación de Victoria
-
RF05.1: El módulo recibirá una representación de partida en formato YEN y determinará si existe un ganador.
-
RF05.2: El módulo identificará qué jugador ha ganado la partida.
-
RF05.3: El módulo detectará condiciones de empate o tablas.
-
RF05.4: La respuesta incluirá el estado del juego en formato JSON.
-
RF06 - Servicio Web
-
RF06.1: El módulo ofrecerá un mecanismo de comunicación remota para ser invocado por otros subsistemas.
-
RF06.2: El módulo permitirá verificar si una partida ha sido ganada.
-
RF06.3: El módulo proporcionará un mecanismo para verificar su disponibilidad operativa.
-
RF06.4: Todas las respuestas del servicio serán en formato JSON.
-
RF07 - Procesamiento de Formato YEN
-
RF07.1: El módulo interpretará correctamente las partidas codificadas según la notación YEN.
-
RF07.2: El módulo validará que la notación YEN recibida sea correcta sintácticamente.
-
RF07.3: El módulo rechazará peticiones con formato YEN inválido con código de error apropiado.
1.2. Requisitos de Calidad
| Atributo de calidad | Motivación |
|---|---|
Rendimiento (RNF01) |
El sistema deberá responder a las peticiones de juego en menos de 500ms y soportar al menos 500 usuarios concurrentes. |
Seguridad (RNF02) |
Las comunicaciones entre módulos y con clientes deberán ir cifradas mediante HTTPS, y las contraseñas se almacenarán con hash seguro. |
Disponibilidad (RNF03) |
El sistema deberá tener una disponibilidad mínima del 99% en horario de operación. |
Mantenibilidad (RNF04) |
El código de ambos módulos deberá incluir pruebas unitarias con cobertura mínima del 70% y estar adecuadamente documentado. |
Usabilidad (RNF05) |
La interfaz web deberá ser responsive y funcionar correctamente en dispositivos móviles y desktop. |
Interoperabilidad (RNF06) |
La comunicación entre módulos deberá realizarse exclusivamente mediante JSON siguiendo la notación YEN. |
1.3. Stakeholders
| Nombre | Metas |
|---|---|
Micrati |
Empresa involucrada en el proyecto. Busca un producto final estable y mantenible, alineado con los requisitos acordados y con una integración correcta entre módulos. |
Usuarios |
Personas que usan la aplicación. Quieren una experiencia de juego fluida y clara, partidas fiables y acceso sencillo a su historial y estadísticas. |
Equipo de desarrolladores |
Desarrolladores encargados de construir y mantener el sistema. Buscan una arquitectura robusta, fácil de probar y evolucionar, con buen rendimiento y documentación que facilite el trabajo. |
Profesores |
Supervisores/asesores académicos del proyecto. Esperan una solución bien justificada y documentada, con buenas prácticas y cumplimiento verificable de los requisitos. |
2. Restricciones de Arquitectura
En este apartado se describen las restricciones de arquitectura que afectan a este proyecto. Estas restricciones pueden ser técnicas u organizativas y pueden incluir convenciones como directrices de programación, versionado, documentación o nomenclatura.
2.1. Restricciones Técnicas y Estructurales
| Restricción | Descripción |
|---|---|
Control de Versiones |
Usaremos Git y GitHub para el control de versiones del proyecto |
Documentación |
La documentación del proyecto estará basada en el formato arc42 y se alojará en GitHub Pages |
Lenguajes de Programación |
El proyecto se desarrollará principalmente en JavaScript, utilizando Node.js para el backend y React para el frontend. Además el motor del juego estará en Rust |
Testing |
Se utilizará Jest para testing unitario y Cypress para testing end-to-end |
Apis Creadas |
Se necesitarán APIs para la comunicación entre el frontend y el backend |
Deployment |
El despliegue del proyecto se hará en una máquina Linux con docker instalado creando un contenedor por cada módulo |
2.2. Restricciones Organizativas
| Restricción | Descripción |
|---|---|
Reuniones |
Nos reuniremos todas las semanas los jueves de 10:00-11:00 |
GitHub issues |
Los issues de GitHub se usarán para gestionar tareas y problemas del proyecto |
3. Contexto y Alcanze
3.1. Contexto de Negocio
Micrati quiere lanzar YOVI, una conunto de juegos basados en el juego Y, accesibles desde la web. El sistema debe permitir que personas jueguen partidas del juego Y desde un frontend web, incluyendo al menos la versión clásica (humano vs máquina) con tamaño de tablero variable. Además, el juego contra la computadora debe ofrecer más de una estrategia seleccionable por el usuario.
Actor |
Cómo interactúa |
Usuarios |
Acceden a YOVI desde la aplicación web para jugar y registrarse. |
Bots |
Invocan la API externa de YOVI enviando la posición en JSON y reciben el siguiente movimiento en YEN. |
Aplicación YOVI |
Recibe peticiones de Usuarios y Bots llama al servicio de lógica en Rust y persiste/consulta datos en la base de datos para histórico/estadísticas. |
3.2. Contexto Técnico
Actor |
Cómo interactúa |
Usuario |
Accede a YOVI mediante la UI Web para jugar y registrarse. |
Bot |
Consume el API de YOVI puede jugar contra la aplicación invocando play(position) y recibiendo el movimiento en notación YEN. |
Aplicación YOVI |
Recibe peticiones del Usuario y del Bot, invoca al Servicio de lógica por HTTP/HTTPS intercambiando JSON (partida en YEN) y gestiona persistencia contra la base de datos. |
Servicio de lógica |
Expone un servicio web básico invocado por YOVI, verifica si la partida está ganada y sugiere el siguiente movimiento, usando JSON en notación YEN. |
Base de datos |
Almacena usuarios, partidas e histórico y recibe operaciones de lectura/escritura desde YOVI para persistir y consultar histórico/estadísticas. |
4. Estrategia de Solución
En este apartado se describen las decisiones fundamentales y estrategias de solución que dan forma a la arquitectura del sistema. Estas decisiones incluyen:
4.1. Decisiones Tecnológicas
| Decisión | Descripción |
|---|---|
Base de datos |
Usaremos MySQL debido a su compatibilidad con el entorno de desarrollo y su robustez para manejar datos estructurados. Además, es una base de datos ampliamente utilizada y entendida por el equipo de desarrollo. |
Visual Studio Code |
Usaremos Visual Studio Code como editor de código principal para su compatibilidad con el entorno de desarrollo y su extensibilidad. |
Express |
Usaremos Express como framework para el backend debido a su simplicidad. |
PlantUML |
Usaremos PlantUML para la creación de diagramas de arquitectura debido a su facilidad de uso y su capacidad para integrarse con otras herramientas. |
4.2. Decisiones para lograr los requisitos de calidad
| Decisión | Descripción |
|---|---|
Usabilidad |
La usabilidad del sistema se logrará mediante una interfaz intuitiva y fácil de usar, siguiendo buenas prácticas de diseño de experiencia de usuario. |
Accesibilidad |
La accesibilidad del sistema se logrará mediante el cumplimiento de estándares de accesibilidad web, garantizando que todos los usuarios puedan interactuar con el sistema sin barreras. |
Rendimiento |
El rendimiento del sistema se logrará mediante el uso de tecnologías eficientes y optimización del código, asegurando una respuesta rápida y fluida del sistema. |
Disponibilidad |
La disponibilidad del sistema se logrará mediante la implementación de mecanismos de redundancia y recuperación ante fallos, garantizando que el sistema esté disponible para los usuarios en todo momento. |
Seguridad |
La seguridad del sistema se logrará mediante la implementación de medidas de seguridad robustas, como autenticación y autorización adecuadas. |
Interoperabilidad |
La interoperabilidad del sistema se logrará mediante el uso de estándares abiertos y protocolos de comunicación comunes, facilitando la integración con otros sistemas. |
4.3. Decisiones Organizativas
-
Los miembros del grupo, ademas de las reuniones semanales que se celebren, mantendrán una comunicación constante a través de whatsapp y se podrán realizar reuniones adicionales si se considera necesario.
-
Se usará github con diferentes ramas para el desarrollo del proyecto, cada miembro del grupo se encargará de una parte del proyecto, aunque se fomentará la colaboración entre todos los miembros para asegurar la calidad del código y la integración de las diferentes partes del proyecto.
5. Vista de bloques de construcción
5.1. Visión general del sistema
- Motivación
-
Visión general del sistema donde el usuario interactua con la aplicación. Esta hace uso del módulo gamey para validar movimientos y detemrinar cuando finaliza el juego. La separación entre WebApp y Gamey permite desacoplar la interfaz de usuario de la lógica del juego y del bot, facilitando el mantenimiento, extensión y reutilización de cada componente.
- Componentes
| Nombre | Responsabilidad |
|---|---|
User |
Interactua con la aplicación. |
WebApp |
Gestiona la interacción del usuario con el sistema. |
Gamey |
Gestiona la lògica del juego, el bot, los movimientos, … |
OpenApi
Comunica el front-end con el back-end Node siguiendo el protocolo HTTP y con el formato JSON. Expone una serie de operaciones para almacenar información de relevancia en la BD. Entre toda esa información, se encuentra:
-
Registro de usuarios.
-
Inicio de partidas.
-
Realización de movimientos.
-
Consulta de puntuaciones. …
BotServer
Comunica el bot con el resto de la aplicación siguiendo el protocolo HTTP y con el formato JSON. La única operación que contempla es la realización de movimientos por parte del bot.
GameServer
Expone el método play para determinar la validez de una jugada realizada por los usuarios y determinar si la jugada permite ganar la partida actua..
5.2. Nivel 2 del sistema
Visión específica del módulo Yovi del sistema y las responsabilidades de los distintos subsistemas existentes en este.
- Componentes
| Nombre | Responsabilidad |
|---|---|
Usuario |
Interactua con la aplicación. |
WebApp |
Expone una interfaz de usuario para que el usuario interacciona con el sistema. |
OpenApi |
Comunica el front-end (WebApp) con el back-end Node (Users). |
Users |
Gestiona la interacción con la base de datos. |
Database |
Almacena un historial de los usuarios registrados, partidas realizadas, puntuaciones obtenidas, … |
Bot |
Contiene la lógica de los bots. |
BotServer |
Permite la interacción del sistema con los bots. |
Core |
Contiene la lógica del juego y gestiona el estado del mismo y la validación de movimientos y reglas. |
GameServer |
Permite la interacción del sistema con la lógica del juego. |
Notation |
Incluye toda la lógica sobre la notación YEN. |
6. Vista de Ejecución (Runtime View)
6.1. Resumen
Este documento describe los escenarios de ejecución más relevantes del sistema YOVI y las interacciones entre sus subsistemas principales: la Aplicación Web (Typescript) y el módulo de lógica en Rust (gamey). El intercambio entre ambos usa JSON en notación YEN para representar posiciones y movimientos. El fichero actualizado es [docs/src/06_runtime_view.adoc](docs/src/06_runtime_view.adoc).
6.2. Escenario 1 — Usuario humano juega contra la máquina (flujo principal)
Propósito: mostrar la interacción típica cuando un usuario desde la web juega contra un bot.
Actores:
- Usuario (navegador)
- Webapp — webapp/src/App.tsx
- Servicio de bots / lógica (Rust) — gamey
Flujo (pasos):
1. Usuario inicia una partida en la UI y selecciona "Jugar vs Máquina" y la estrategia (ej. random).
2. La web prepara la posición inicial en notación YEN y la mantiene como estado local.
3. Usuario hace un movimiento; la web lo muestra en el tablero y el usuario confirma el fin de turno.
4. Webapp manda un post con body JSON con la notación YEN del nuevo estado.
5. El servicio Rust recibe el YEN, lo parsea a GameY y valida la posición.
6. Se invoca al bot y se calcula la respuesta.
7. El servicio devuelve el movimiento en notación YEN; la web lo aplica al tablero y los datos de partida.
8. Se repite 3-7 hasta que se finaliza el juego. Una vez se finaliza, muestra el resultado al jugador y se guardan las estadísticas del juego
6.3. Escenario 2 — Bot externo invoca API "play" (integración con terceros, se juega una partida en otro servidor con nuestro bot)
Propósito: describir cómo clientes externos (bots/servicios) usan la API pública para solicitar movimientos.
Actores: - Cliente bot externo - API de comunicación - GameY
Flujo:
1. Cliente prepara un JSON en notación YEN describiendo la posición y parámetros (p.ej. strategy, difficulty) y hace POST la API de nuestro servidor
2. El endpoint valida la versión de API y los parámetros.
3. Se envía la notación YEN a GameY; si es válido se invoca al bot para que calcule el proximo movimiento.
4. Respuesta: En formato YEN en JSON. Contiene el estado del tablero tras realizar el movimiento.
Flujo altenativo 1: 3* YEN inválido → Se devuelve la peticion en estado de error y con cuerpo explicativo
Flujo alternativo 2: 2* Bot solicitado no reconocido → Se devuelve la peticion en estado de error y con cuerpo explicativo
6.4. Escenario 3 — Humano vs Humano (partida local por turnos)
Propósito: describir la interacción típica cuando dos jugadores comparten la misma instancia de la Webapp y juegan por turnos en el mismo dispositivo o en la misma sesión del navegador.
Actores: - Jugador A (navegador) - Jugador B (mismo navegadors) - Webapp - GameY
Flujo (pasos):
1. Un jugador crea o inicia una partida local en la web y define el tamaño del tablero y opciones
2. La web inicializa la posición en notación YEN y la mantiene como estado compartido entre turnos.
3. Jugador A realiza su movimiento en el tablero; la web serializa la posición resultante a notación YEN y envía una petición POST al servicio GameY para validar/aplicar la jugada (p. ej. POST /v1/game/move).
4. El servicio Rust (GameY) recibe el YEN, valida la jugada con las reglas completas y devuelve la respuesta al frontend
5. La web, al recibir la confirmación, aplica el estado devuelto al tablero y muestra que es el turno del Jugador B; la web no aplica reglas complejas por su cuenta.
6. Jugador B realiza su jugada y se repite 3–5 alternando hasta que se detecta una condición de victoria o empate.
7. Al finalizar la partida, la web envía el resultado al backend para persistencia y estadísticas
Flujo alternativo: 4* El servicio Rust no valida la jugada por no ser válida. Se devuelve esta respuesta al frontend 5* El frontend informa al jugador, deshace la jugada y vuelve a 3.
7. Diagrama de despliegue
7.1. Nivel de infraestructura 1
- Motivation
-
La aplicación se despliega sobre un servidor de Azure, en el que cada módulo que constituye el sistema se encuentra encapsulado en un contenedor de Docker. El usuario interactua con el sistema a través de una interfaz diseñada con React. Está se comunica con el back-end mediante OpenApi. A su vez, el back-end se comunica con la base de datos con la api mencionada anteriormente. El front-end también se comunica con el módulo de juego mediante los módulo Bot-server y Game-server.
- Características de calidad/rendimiento
-
El hecho de emplear Docker para encapsular cada uno de los módulos del sistema en distintos contenedores permite que el sistema sea escalable y portable. Además, la separación de las distintas partes en distintos contenedores facilita el mantenimiento y la extensibilidad. Además, aumenta el rendimiento en comparación con emplear un contendor aislado, ya que se permite aislar las dependencias de cada módulo. Por otro lado, el uso de Docker permite el despliegue continuo de nuestra aplicación.
- Mapeo de los bloques de construcción a infraestructura
| Nombre | Descripción |
|---|---|
Azure |
Servicio con el servidor en el que se encuentra la aplicación. |
Docker |
Genera cada uno de los contenedores para almacenar cada uno de los módulos de la aplicación. |
WebApp |
Front-end diseñado con React para la interacción con el usuario. |
Users |
Back-end diseñado con Node para gestionar la interacción con la BD. |
Gamey |
Módulo Rust con la lógica del juego y del bot. |
Database |
Almacena un registro de los usuarios de la aplicación, las partidas realizadas, los usuarios obtenidos, … |
8. Cross-cutting Concepts
8.1. <Concept 1>
<explanation>
8.2. <Concept 2>
<explanation>
…
8.3. <Concept n>
<explanation>
9. Architecture Decisions
10. Quality Requirements
10.1. Quality Tree
10.2. Quality Scenarios
11. Risks and Technical Debts
12. Glossary
| Term | Definition |
|---|---|
<Term-1> |
<definition-1> |
<Term-2> |
<definition-2> |
