Calendario de lanzamientos
Calendario mensual de lanzamientos de videojuegos (PC, PlayStation, Xbox y
Switch) con datos de IGDB. Permite marcar cada juego
como me interesa, reservado, comprado o no me interesa. Los juegos más
esperados (hype de IGDB) se destacan, y en Mi lista ves todos los que
sigues, sean del mes que sean (p. ej. los que te interesaban y aún no has
comprado).
Se instala como app (PWA) y se despliega en Vercel, con Supabase como base de
datos y autenticación.
Cómo funciona
navegador ──► /api/calendar?month=YYYY-MM ──► Supabase (caché) ──► IGDB
│ ──► /api/games?ids=1,2,3 ─────────► Supabase (caché) ──► IGDB
│ ──► /api/game?id=123 ─────────────► Supabase (caché) ──► IGDB
│ (Vercel)
└──► Supabase (tracked_games, con RLS)
/api/calendar devuelve el calendario de un mes agrupado por juego.
Sigue un cache-aside: si el mes se descargó hace menos de 12 h lo lee de
Supabase; si no, lo pide a IGDB, lo guarda y borra las fechas que IGDB ya no
devuelve. Si IGDB falla, sirve la caché aunque esté caducada. Encima, el CDN
de Vercel guarda la respuesta (1 h, y hasta 24 h más mientras revalida), así
que el calendario puede llegar a tener unas 37 h de antigüedad./api/games devuelve juegos concretos con todas sus fechas, para Mi
lista. Los que llevan más de 12 h sin comprobarse los actualiza antes desde
IGDB, para que un retraso se vea aunque nadie abra el mes antiguo; si IGDB
falla, sirve la caché. Solo atiende juegos que ya están en ella; los demás se
muestran con el nombre y la carátula guardados en tracked_games./api/game devuelve la ficha de un juego (resumen, géneros, compañías,
capturas, tráiler), que se abre al pulsar una tarjeta o una fila. Se pide a
IGDB bajo demanda y se guarda 7 días en game_details. Solo atiende juegos
que ya están en la caché del calendario.- El navegador filtra (descartados, "solo míos"), agrupa Mi lista y
guarda tus estados directamente en Supabase con la anon key; el RLS hace
que cada usuario solo vea y toque sus filas.
- Fecha principal: un juego aparece una vez por mes, en la fecha que sale
en más plataformas (la más tardía si empatan). Las fechas exclusivas de Asia
solo se usan si el juego no tiene otra.
Estructura
| Archivo | Qué hace |
|---|
index.html, styles.css, app.js | Interfaz (sin build ni framework) |
theme-init.js | Aplica el tema claro u oscuro antes de pintar |
releases.js | Fecha principal, grupos de Mi lista y orden de fechas de la ficha (funciones puras) |
config.js | URL y anon key públicas de Supabase |
api/calendar.js | Endpoint del calendario de un mes |
api/games.js | Endpoint de juegos por id (Mi lista) |
api/game.js | Endpoint de la ficha de un juego |
lib/igdb.js | Descarga de IGDB y caché en Supabase |
lib/transform.js | Transformaciones de datos (funciones puras) |
lib/igdbToken.js | Token de Twitch, guardado en Supabase |
lib/supabase.js | Cliente de Supabase con la service_role key |
schema.sql | Tablas y políticas RLS (no se despliega) |
vercel.json | Cabeceras de seguridad (CSP y otras) |
test/ | Tests (no se despliegan, ver .vercelignore) |
Puesta en marcha
-
Supabase: crea un proyecto y ejecuta schema.sql en el SQL Editor.
Crea tu usuario en Authentication → Users: la app solo tiene inicio de sesión, no registro.
Desactiva también el registro en la configuración de Authentication: la pantalla no lo ofrece,
pero con la anon key pública cualquiera podría crearse una cuenta llamando a la API.
-
Twitch/IGDB: registra una aplicación en
https://dev.twitch.tv/console/apps (tipo Confidential) para obtener el
Client ID y el Client Secret.
-
config.js: pon la URL y la anon key de Supabase. Son públicas;
nunca pongas aquí la service_role key. Pon también la URL en
connect-src de la CSP, en vercel.json.
-
Vercel: importa el repositorio y define estas variables de entorno:
| Variable | Origen |
|---|
SUPABASE_URL | Supabase → Project Settings → API |
SUPABASE_SERVICE_ROLE_KEY | Ídem (secreta: ignora el RLS) |
TWITCH_CLIENT_ID | Consola de Twitch |
TWITCH_CLIENT_SECRET | Consola de Twitch (secreta) |
Requiere Node 22 o superior.
Tests
npm test
Usan el test runner de Node (node:test), sin dependencias. Cubren las
funciones puras de lib/transform.js y releases.js; no tocan la red ni
Supabase.
Datos de IGDB a tener en cuenta
- Solo se descargan juegos con al menos 1 de hype, para dejar fuera los que
nadie espera. Los de 30 o más se destacan con 🔥. Excepción: los DLC,
expansiones (también las standalone), temporadas y actualizaciones entran
aunque tengan 0 de hype, porque se añaden a IGDB poco antes de salir y casi
nunca llegan a tenerlo.
- La duración de la ficha sale de
game_time_to_beats (tiempos que envían
los jugadores de IGDB), así que solo hay datos de juegos ya publicados.
No se usa HowLongToBeat: no tiene API y su robots.txt prohíbe el
acceso automatizado sin permiso de Ziff Davis.
- La precisión de la fecha se deduce del texto de IGDB:
"Oct 20, 2026" es
exacta; "Q4 2026", "2026" o "TBD" son aproximadas.
- La región sale de
release_region (1 Europa, 2 Norteamérica, 5 Japón,
8 mundial…). El antiguo campo region está obsoleto y ya no viene relleno.
