Volley

Sobre el proyecto

Volley es un servicio para el pueblo, sin ánimo de lucro y con coste cero. Aquí se cuenta qué problema resuelve y cómo está construido.

El problema

Las tres canchas públicas de arena se organizaban a ojo: grupos de mensajería, gente que llegaba y no había sitio, partidos que se quedaban cojos. Nadie sabía cuántos jugarían ni si el tiempo acompañaba.

La solución

Una app web instalable (PWA) donde cada persona se apunta a una franja de 1.5 h 30 min en una de las 3 canchas. Cada cancha tiene 12 plazas (6 por equipo) y el partido se crea cuando alguien se apunta primero.

Es gratis, sin publicidad y sin vender datos. La web que estás viendo es la parte pública; la app está en /app.

Qué hace

  • Apuntarse y dejar la plaza, con límite de 2 franjas al día y lista cerrada 30 minutos antes.
  • Faltas por bajas tardías (menos de 2 h): a las 3 no se puede crear ni unirse a partidos nuevos durante 7 días.
  • Previsión del tiempo por zona (Open-Meteo) y avisos del administrador.
  • Actualizaciones en directo y notificaciones push opcionales.
  • Panel de administración: cierres de franjas, avisos, ajustes y un superadmin que da de alta al resto del equipo.
  • Español e inglés, accesible y pensado para el móvil.

Probar la demo sin entrar

Arquitectura

Diagrama de arquitecturaEl navegador carga la web estática desde Cloudflare Pages y habla con Supabase para el inicio de sesión, los datos y las actualizaciones en directo. El tiempo viene de Open-Meteo. Los avisos push salen de una Edge Function a través de los servicios push del navegador.Navegador (PWA)Astro + React + TailwindCloudflare PagesAlojamiento estáticoSupabaseAuth (Google)Postgres + RLSFunciones SQLpg_cronRealtimeEdge FnOpen-MeteoPrevisión del tiempoServicios push del navegadorGitHub ActionsPruebas y comprobaciones
El navegador carga la web estática desde Cloudflare Pages y habla con Supabase para el inicio de sesión, los datos y las actualizaciones en directo. El tiempo viene de Open-Meteo. Los avisos push salen de una Edge Function a través de los servicios push del navegador.

Decisiones técnicas

Las reglas viven en la base de datos
Cada tabla tiene RLS activada y las acciones importantes (apuntarse, dejar la plaza, cerrar una franja) son funciones SQL. Aunque alguien manipule el navegador, la base de datos hace cumplir las normas.
Privacidad por diseño
Nadie ve datos de otras personas: solo lo mínimo para jugar, con RLS y funciones que devuelven lo justo. Solo se guarda lo necesario para iniciar sesión con Google.
Coste cero
Hosting estático gratuito, Supabase en plan gratuito, Open-Meteo sin clave y GitHub Actions. Ningún servicio de pago.
Web pública estática, app aparte
La web pública es Astro puro (rápida, buena para buscadores). La app React se carga solo en /app, y librerías pesadas como la del PDF no se descargan en la parte pública.
Preparada para crecer
La cámara (QR) y las notificaciones están en un módulo aislado para poder sustituirlo por Capacitor si algún día hay app nativa.

Calidad y seguridad

  • Pruebas unitarias con Vitest para las reglas, los textos y el SEO.
  • Bloques de pruebas SQL que se ejecutan contra la base de datos y se deshacen solos al terminar.
  • Pruebas de extremo a extremo con Playwright en escritorio y móvil.
  • Integración continua con GitHub Actions en cada cambio.
  • Cabeceras de seguridad (CSP), migraciones SQL versionadas y revisión de seguridad propia.

Tecnología

  • Astro
  • React
  • TypeScript
  • Tailwind CSS
  • PWA
  • Supabase (Postgres, Auth, RLS, pg_cron, Realtime, Edge Functions)
  • Open-Meteo
  • Vitest
  • Playwright
  • GitHub Actions
  • Cloudflare Pages

Estado

En desarrollo, a las puertas del lanzamiento. El código está en un repositorio privado: si te interesa verlo para un proceso de selección o por curiosidad técnica, escríbeme y te doy acceso.

Contacto· volleyplaya.dev@gmail.com