Aller au contenu principal
T
tekivo
En production Application web janvier 2025

Qyo

Application web collaborative de musique en temps réel pour événements. Les invités proposent et votent pour les morceaux, tandis que l'hôte garde le contrôle total de la lecture. Multi-sources (YouTube, SoundCloud, fichiers locaux), WebSocket temps réel, PWA installable et bilingue FR/EN.

Next.js NestJS PostgreSQL Socket.IO TypeScript Docker
Qyo - Site
Défiler pour voir plus

Le projet

Qyo est une application web permettant de gérer collaborativement la musique lors d’événements. L’hôte crée un événement et partage un code ou QR code avec ses invités, qui peuvent ensuite proposer des morceaux et voter en temps réel pour décider de la playlist.

Fonctionnalités clés

Pour l’hôte

  • Création d’événements avec code d’accès et QR code
  • Choix des sources musicales autorisées par événement
  • Contrôle de lecture complet : play, pause, skip
  • Modération de la file d’attente : ban, kick, boost de priorité
  • Gestion des invités : expulsion ou bannissement
  • Compte persistant avec authentification email/mot de passe ou Google OAuth

Pour les invités

  • Zéro friction : pas de compte requis, juste un pseudonyme
  • Recherche et soumission de morceaux depuis les sources activées
  • Vote pour les morceaux (un vote par morceau, toggleable)
  • Visibilité en temps réel de la file d’attente et des votes
  • Notifications : morceau en lecture, expulsion, bannissement

Sources musicales

  • YouTube : recherche et lecture via l’API IFrame Player
  • SoundCloud : validation et lecture via Widget API
  • Fichiers locaux : upload via File System Access API, métadonnées extraites automatiquement

Temps réel

  • Communication WebSocket (Socket.IO) pour des mises à jour instantanées
  • Nouvelles soumissions, changements de votes, réordonnancement de la file
  • Notifications d’arrivée/départ des invités
  • Synchronisation de l’état de lecture

Stack technique

  • Frontend : Next.js 14 (App Router), TypeScript, Tailwind CSS, Zustand
  • Backend : NestJS, TypeORM, PostgreSQL, Redis
  • Temps réel : Socket.IO avec auto-reconnexion
  • Auth : JWT (RS256) pour les hôtes, sessions Redis pour les invités
  • Déploiement : Docker Compose, Caddy (reverse proxy), Hetzner Cloud
  • Qualité : ESLint, TypeScript strict, tests Jest

Points forts techniques

  • Architecture monorepo avec types partagés entre frontend et backend
  • Rate limiting intelligent : cooldown de soumission, limite de recherche par session
  • PWA installable sur mobile et desktop
  • Internationalisation complète français/anglais (next-intl)
  • Sécurité : CORS strict, validation des entrées, protection HTTPS automatique

Envie d'un projet similaire ?

Contactez-nous pour discuter de votre projet. Devis gratuit sous 48h.