lopezac / futbol-libre-status

Futbol Libre Status

Esta aplicación la creé para empezar a meterme en el mundo de PHP y Docker. Lo que empezó como un proyecto para aprender lo básico terminó siendo una aplicación completa con un pequeño frontend. La app funciona con una REST API y realiza web scraping para encontrar URLs relacionadas con "futbol libre".

Backend

El backend está desarrollado en PHP y utiliza la librería Guzzle para manejar las requests HTTP. Está desplegado en un servidor web Apache y cuenta con dos endpoints principales:

• GET /pages:

  • Devuelve todas las páginas que están almacenadas en la base de datos.

• POST /pages/update:

  1. Web Scraping: Busca la palabra clave "futbol libre" en varios motores de búsqueda (Bing, Goo.ne.jp, Yahoo, Lili.org) y recopila todas las URLs que contienen palabras clave relacionadas como "futbol", "libre", "televisión", "pelota", etc.
  2. Validación: Verifica que cada URL encontrada esté activa (no caída), que no esté en la lista de URLs prohibidas y que no contenga palabras clave no deseadas (definidas en PageModel).
  3. Actualización de la Base de Datos: Se eliminan las URLs que están actualmente en la base de datos (esto se podría optimizar) y se insertan las nuevas URLs validadas.

Testeos Básicos

Para asegurar que las funcionalidades principales del backend funcionen correctamente, implemente basicos tests unitarios utilizando Pest, un framework de testing moderno y sencillo de usar para PHP.

Para correr los tests ejecuta en la terminal:

./backend/vendor/bin/pest ./backend/tests

Frontend

El frontend es una aplicación SPA (Single Page Application) construida en React con estilos de Bootstrap. La app se comunica con el backend para obtener las URLs y las almacena en localStorage, así evitamos pedirlas al backend en cada visita.

Despliegue

El principal desafío fue encontrar un servicio de hosting que soporte tanto el backend como la base de datos MySQL. Como solución temporal, creé una branch production en GitHub donde las páginas obtenidas de la base de datos están hardcodeadas. La aplicación está desplegada en Netlify y podés probarla acá: Futbol Libre Status.

Configuración del Entorno

Variables de Entorno

El proyecto usa archivos .env para manejar las configuraciones en diferentes partes de la aplicación. Así deberían verse:

• Backend (/backend/.php.env):

  FRONTEND_URL=http://localhost:3000
  DB_HOST=db_host
  DB_NAME=db_name
  DB_USER=db_username
  DB_PASSWORD=db_password
  

• Base de Datos (/backend/.db.env):

  MYSQL_ROOT_PASSWORD=db_root_password
  MYSQL_DATABASE=db_name
  MYSQL_USER=db_username
  MYSQL_PASSWORD=db_password
  

• Frontend (/frontend/.frontend.env):

  REACT_APP_BACKEND_URL=http://localhost:8000/index.php
  

Tecnologías Utilizadas

• Backend: PHP, Guzzle, Apache, MySQL, Pest
• Frontend: React, Bootstrap
• Infraestructura: Docker

Instrucciones para Levantar la App

Requisitos

• Docker Engine

Pasos

• Cloná este repositorio.
• Configurá las variables de entorno en los archivos .env.
• Ejecutá docker compose up --build -d para levantar los servicios.
• Abrí http://localhost:3000 en tu navegador para ver la app funcionando.

Contribuciones

Si tenés alguna sugerencia, encontrás un bug o querés proponer una mejora, no dudes en abrir un issue o mandar un pull request.