Proyecto Semestral - Diseño de Aplicaciones Web
IDS 6to Semestre
Este proyecto busca realizar un juego online interactivo inspirado por el juego de mesa Pictionary en donde un grupo de personas intentan dibujar la oración o palabra dada.
Cháchara es un juego multijugador en línea inspirado en Pictionary, donde los participantes compiten por identificar palabras y frases basándose en dibujos creados en tiempo real. Un jugador es designado para hacer un dibujo que represente la palabra o frase asignada, mientras que los demás jugadores se esfuerzan por adivinar el contenido antes de que expire el límite de tiempo.
Entre las funcionalidades proyectadas se encuentran: salas de juego con código de acceso, dibujo colaborativo en tiempo real, y selección de avatar personalizable.
- Java 21 instalado
- Gradle (viene incluido en el proyecto con gradlew)
-
Configurar la base de datos:
Por defecto, el proyecto usa AWS (base de datos en la nube) por lo que no necesitas instalar PostgreSQL.
Deberas crear un archivo
.enven la carpetabackend/, puedes basarte en el.env.example. -
Ejecutar el backend:
Abre una terminal en la carpeta
backendy ejecuta:.\gradlew bootRunEl servidor se iniciará en
http://localhost:8080. -
Ejecutar el frontend:
- Instala en Visual Studio Code la extensión Live Server:
- Haz click derecho sobre el archivo
index.htmly selecciona Open with Live Server.
El frontend automaticamente se conectará con el backend y levantará un servidor local.
| Tecnología | Descripción |
|---|---|
| HTML5 | Estructura y contenido de las páginas |
| CSS3 | Estilos, animaciones y diseño responsivo |
| JavaScript | Lógica del cliente y conexión con la API |
| Google Fonts (Fredoka) | Tipografía principal del juego |
| Tecnología | Descripción |
|---|---|
| Java 21 | Lenguaje principal del servidor |
| Spring Boot 3 | Framework para la API REST |
| Spring Data JPA | Gestión y persistencia de datos |
| Spring Security + BCrypt | Autenticación y cifrado de contraseñas |
| Gradle | Gestor de dependencias y construcción del proyecto |
| Tecnología | Descripción |
|---|---|
| PostgreSQL | Base de datos relacional principal |
| dotenv-java | Gestión de variables de entorno para credenciales |
- Michelle Anahi Lopez Diaz de Leon : Frontend (HTML, CSS y Javascript)
- Kevin Rucoba Moreno : Backend (Java, Springboot y dotenv)
- Jorge Eduardo Tello Castillo : Infraestructura (Base de datos, AWS e instancias)
- Emiliano Leos Beas : Documentacion y diseño de business analysit (UI/UX, Wireframes, Mockup)