Rayan Benachour

Organiser un tournoi communautaire à la main, c'est un tableur et un salon Discord saturé. J'ai remplacé ça par une plateforme qui prend le tournoi des inscriptions jusqu'à la remise des lots : arbres de compétition, pronostics des spectateurs, tirages au sort diffusés en direct, envoi automatique des récompenses. Connexion par Discord en OAuth 2.0.

Le sujet compliqué, c'était la synchronisation. Le site, le bot Discord et l'overlay du stream doivent afficher la même chose à la même seconde. Un décalage d'une demi-seconde et les spectateurs voient un résultat qui n'existe pas encore. C'est cette contrainte qui a dicté toute l'architecture.

• 3 675 joueurs inscrits
• 6 éditions, 2 500 euros distribués
• Synchronisation temps réel
• Bot Discord

• Next.js
• TypeScript
• Supabase
• PostgreSQL
• Tailwind CSS
• Discord.js
• WebSocket
• Remotion
• Recharts

Les données d'un serveur Palworld vivent dans un fichier de sauvegarde binaire propriétaire, illisible pour les joueurs comme pour l'administrateur. J'ai livré un portail qui les ouvre. Vingt-deux pages : profils des joueurs et des guildes, encyclopédie des espèces, classements, succès, statistiques, carte interactive du monde, calculateur de reproduction, plus un espace d'administration avec synchronisation et journaux. Les données sont rafraîchies toutes les quinze secondes environ. Hébergé en Docker derrière un proxy, sans que l'adresse du serveur ne soit jamais exposée.

Les pages ne savent jamais d'où viennent les données. Une variable d'environnement suffit à basculer entre un monde fictif en mémoire, la base, l'API du jeu, un accès FTP Nitrado ou une sauvegarde. Les sauvegardes sont des fichiers binaires propriétaires : plutôt que d'écrire un parseur qu'il aurait fallu réparer à chaque mise à jour du jeu, j'ai mis un adaptateur devant un convertisseur externe. La carte, elle, est écrite à la main, sans librairie de cartographie. C'est le choix le plus discutable du projet, Leaflet aurait fait l'affaire, mais je voulais le zoom, le déplacement et les filtres exactement comme je les avais en tête.

• 22 pages
• 5 sources de données interchangeables
• Docker et docker-compose

• Next.js 15
• TypeScript
• Prisma
• SQLite
• Zod
• TanStack Query
• Recharts
• Docker
• Vitest
• Playwright

Une plateforme de statistiques et d'overlays personnalisables à poser dans OBS. PostgreSQL piloté par Prisma, connexion Discord ou Twitch via NextAuth, niveaux d'accès gérés avec Stripe et un bot Discord par-dessus.

Dès qu'un abonnement Stripe est en jeu, une régression n'est plus un désagrément, c'est un remboursement. C'est ce qui m'a poussé à travailler les tests ici plus que partout ailleurs. Jest pour l'unitaire, Playwright pour les parcours complets, et des suites à part pour la sécurité, la performance et la non-régression.

• Paiements Stripe en production
• Suites de tests séparées
• OAuth Discord et Twitch

• Next.js 14
• TypeScript
• Prisma
• PostgreSQL
• NextAuth
• Stripe
• Discord.js
• Jest
• Playwright