Skip to content

Latest commit

 

History

History
102 lines (76 loc) · 4.03 KB

File metadata and controls

102 lines (76 loc) · 4.03 KB

OKLM Drag Club

Site vitrine du podcast drag et téléréalité de Romain — catalogue des épisodes et accès centralisé aux plateformes d'écoute.

Next.js TypeScript Tailwind CSS Vercel

oklmdragclub.com · Portfolio


À propos

OKLM Drag Club est un podcast de réaction drag et téléréalité — Drag Race France, Dragula, Les Traîtres FR, Ultime Drag ASMR — créé par Romain avec un ton calme et bienveillant. Ce site en est la vitrine : il liste les épisodes par émission et renvoie vers les plateformes d'écoute. Entièrement statique, sans base de données — les épisodes sont récupérés depuis le flux RSS Anchor.fm au moment du build et enrichis par un fichier de correctifs local.

Fonctionnalités

  • Catalogue des épisodes par émission (Drag Race France, Dragula, Les Traîtres FR, Ultime Drag ASMR, Fan Fiction)
  • Page détail par épisode avec description, durée et liens directs vers Spotify, Apple Podcasts, Deezer, Amazon Music
  • Mise à jour automatique via flux RSS au build — aucune intervention manuelle pour un nouvel épisode
  • Images Open Graph générées dynamiquement par épisode et par émission
  • Endpoint /api/rebuild pour forcer un redéploiement sans push git
  • Sitemap et robots.txt générés automatiquement

Stack technique

Catégorie Outils
Framework Next.js 16 (App Router, SSG)
UI React 19, TypeScript 5 strict
Style Tailwind CSS v4
Données Flux RSS Anchor.fm + overrides.json local
Parsing fast-xml-parser 5
Monitoring Sentry
CI GitHub Actions (lint, type-check, tests, build)
Déploiement Vercel

Démarrer

Prérequis

  • Node.js ≥ 20
  • npm ≥ 10

Installation

git clone <repo>
cd oklm-drag-club
npm install

Variables d'environnement

Variable Obligatoire Description
NEXT_PUBLIC_SITE_URL Recommandée URL publique du site (ex : https://oklmdragclub.com)
VERCEL_DEPLOY_HOOK_URL Pour /api/rebuild URL du deploy hook Vercel
REBUILD_SECRET Pour /api/rebuild Secret partagé pour protéger l'endpoint rebuild

En l'absence de NEXT_PUBLIC_SITE_URL, le site utilise VERCEL_URL (injecté par Vercel) puis http://localhost:3000.

Scripts disponibles

Commande Description
npm run dev Serveur de développement sur http://localhost:3000
npm run build Build de production (fetch RSS au build)
npm run start Démarre le serveur de production
npm run lint ESLint
npm run type-check Vérification TypeScript sans émission
npm test Tests unitaires (vitest)

Architecture

src/
├── app/                    # Pages et routes (App Router)
│   ├── api/rebuild/        # Endpoint POST — déclenche un redéploiement Vercel
│   ├── emissions/[show]/   # Page par émission
│   ├── episodes/[id]/      # Page détail d'un épisode
│   └── ...
├── components/             # Composants React
├── data/
│   └── overrides.json      # Liens Deezer, Amazon Music et correctifs manuels
└── lib/
    ├── config.ts           # Constantes globales (URLs, noms)
    ├── rss.ts              # Fetch et parsing du flux RSS
    ├── shows.ts            # Configuration des émissions (couleurs, slugs, labels)
    ├── platforms.ts        # URLs par plateforme d'écoute
    └── utils.ts            # Utilitaires (slugify, constantes)

Construit par Josué Rocha · LinkedIn · GitHub