FutbolAI

FutbolAI es una aplicación web orientada al mundo del fútbol que combina contenido informativo, gestión de usuarios y funciones apoyadas por inteligencia artificial. El proyecto está dividido en dos partes:

• FrontEnd: interfaz web construida con React y Vite.
• Backend: API construida con Node.js y Express, conectada a MySQL.

La plataforma incluye módulos como noticias, partidos, tabla de posiciones, centro social, tablero de mensajes y un oráculo con funciones de predicción y consulta.

Funcionalidades principales

• Visualización de noticias de fútbol.
• Consulta de partidos y equipos.
• Tabla de posiciones.
• Inicio de sesión y registro de usuarios.
• Centro social con seguimiento entre usuarios.
• Tablero global de mensajes.
• Administración de usuarios, equipos, partidos y noticias.
• Carga y descarga de archivos desde el servidor.
• Módulo "Oráculo" con integración de IA.

Estructura del proyecto

06_FutbolAI/
|-- FrontEnd/
|   |-- src/
|   |-- public/
|   |-- package.json
|
|-- Backend/
|   |-- controllers/
|   |-- routes/
|   |-- BaseD/
|   |-- public/
|   |-- server.js
|   |-- .env
|   |-- package.json
|
|-- README.md

Tecnologías usadas

• React
• Vite
• Node.js
• Express
• MySQL
• Axios
• TensorFlow.js

Requisitos previos

Antes de ejecutar el proyecto, asegúrate de tener instalado:

• Node.js
• npm
• MySQL Server o XAMPP con MySQL/MariaDB

Cómo visualizar la página web

Para ver FutbolAI funcionando localmente debes iniciar el backend y el frontend por separado.

1. Instalar dependencias del frontend

Abre una terminal en la carpeta FrontEnd y ejecuta:

cd "\06_FutbolAI\FrontEnd"
npm install

2. Instalar dependencias del backend

Abre otra terminal en la carpeta Backend y ejecuta:

cd "\06_FutbolAI\Backend"
npm install

3. Iniciar la base de datos

Debes tener MySQL activo antes de iniciar el backend.

Si usas XAMPP:

• Abre XAMPP Control Panel.
• Inicia el módulo MySQL.

Si usas MySQL Server:

• Verifica que el servicio de MySQL esté ejecutándose.

4. Ejecutar el backend

Desde la carpeta Backend ejecuta:

node server.js

El backend corre en:

http://localhost:3001

Durante el arranque, el servidor:

• inicializa la base de datos,
• crea las tablas si no existen,
• inserta datos base,
• intenta cargar equipos desde una API externa,
• genera partidos por defecto.

5. Ejecutar el frontend

Desde la carpeta FrontEnd ejecuta:

npm run dev

Vite mostrará una URL en consola, normalmente:

http://localhost:5173

Abre esa URL en tu navegador para visualizar la página.

Cómo conectar el proyecto con la base de datos

La conexión a MySQL se configura en el archivo:

Backend/.env

Las variables que usa el backend son:

DB_HOST=localhost
DB_PORT=3306
DB_USER=tu_usuario
DB_PASSWORD=tu_contrasena
DB_NAME=futbol_ai

Opción 1. Usar el usuario root

Si en tu MySQL trabajas con root, configura el .env con tus datos reales. Por ejemplo:

DB_HOST=localhost
DB_PORT=3306
DB_USER=root
DB_PASSWORD=
DB_NAME=futbol_ai

Esto funciona si tu usuario root no tiene contraseña o si escribes la contraseña correcta.

Opción 2. Crear un usuario específico para el proyecto

El archivo Backend/BaseD/init.sql contiene instrucciones para crear la base de datos y también un usuario dedicado. Si prefieres usar un usuario exclusivo para FutbolAI, puedes cambiar el .env a ese usuario después de crearlo en MySQL.

Ejemplo:

DB_HOST=localhost
DB_PORT=3306
DB_USER=un_usr
DB_PASSWORD=una_clave
DB_NAME=futbol_ai

Inicialización automática de la base de datos

Cuando ejecutas node server.js, el backend lanza el script de inicialización definido en Backend/BaseD/initDB.js.

Ese script:

• crea la base de datos futbol_ai si no existe,
• ejecuta el contenido de Backend/BaseD/init.sql,
• crea las tablas principales,
• inserta datos iniciales de usuarios, noticias, seguidores y mensajes.

Esto significa que no necesitas crear manualmente todas las tablas si la conexión a MySQL está bien configurada.

Datos y servicios externos

El backend utiliza servicios externos para algunas funciones:

• API de fútbol para cargar equipos.
• servicio de correo para recuperación de contraseña.
• servicio de IA para el módulo del oráculo.

Estas integraciones se configuran también desde el archivo .env.

Importante:

• No compartas públicamente claves API, contraseñas ni credenciales de correo.
• Si el proyecto se va a subir a GitHub, es recomendable excluir o limpiar el archivo .env.

Problemas comunes

Error de conexión a MySQL

Revisa:

• que MySQL esté encendido,
• que el puerto 3306 sea correcto,
• que el usuario y contraseña del .env coincidan con tu instalación.

El frontend abre pero no carga datos

Revisa:

• que el backend esté corriendo en http://localhost:3001,
• que no haya errores en la terminal del backend,
• que la base de datos haya iniciado correctamente.

Error al ejecutar npm install

Revisa:

• que Node.js esté instalado,
• que npm funcione desde la terminal,
• que estés ejecutando el comando dentro de la carpeta correcta.

Flujo recomendado de ejecución

Cada vez que quieras trabajar en el proyecto:

1. Inicia MySQL.
2. Ejecuta node server.js en Backend.
3. Ejecuta npm run dev en FrontEnd.
4. Abre http://localhost:5173 en el navegador.

Notas importantes

• El frontend consume el backend usando la URL http://localhost:3001.
• Si el backend no está activo, varias vistas del frontend no mostrarán información.
• Algunas funciones dependen de internet y de claves configuradas en el .env.

Autores

Proyecto colaborativo desarrollado en la asignatura Programación en la Web
Universidad Industrial de Santander (UIS).

Integrantes del equipo:

• Sofia Victoria Vega Suarez (@codebysofiav)
• Ivan Augusto Camargo (@popcorner893)
• Nicolás Linares Rojas
• Andres David Garcia Hernandez