Contexte
Transcendance est le projet final du cursus du tronc commun de l’École 42. Il est conçu pour être réalisé en équipe de 5 étudiants, mais comme personne n’était disponible à ce moment-là , j’ai dû réaliser la majeure partie du projet seul. J’ai toutefois pu être assisté par un pair vers la fin du projet pour quelques tâches.
Cela signifie que j’ai été responsable de chaque aspect du projet : frontend, backend, authentification, communication en temps réel, conception de la base de données, conteneurisation avec Docker, et l’architecture générale.
Stack technologique
- Frontend : Vue.js 3 avec Vuetify (Composition API, Pinia, Vue Router)
- Backend : NestJS (TypeScript)
- Moteur de jeu : Cocos Creator (Client) et cannon-es (Physique Serveur)
- Temps RĂ©el & RĂ©seau : Colyseus (Framework serveur multi-joueurs)
- Authentification : OAuth 42 + JWT
- Base de Données : PostgreSQL avec Sequelize
- Infrastructure : Docker Compose
Ce que j’ai construit
Moteur de jeu
- Pong en temps réel avec simulation physique sur le serveur
- Rendu client synchronisé via WebSocket
- Mode spectateur
Infrastructure & backend modulaire
- Entièrement conteneurisé avec Docker Compose (une commande pour démarrer toute l’infrastructure).
- Architecture backend hautement modulaire, séparant proprement l’authentification, le jeu, le chat, et la gestion des utilisateurs.
- Gestion dynamique de la base de données relationnelle et synchronisation automatique des schémas.
- Proxy inverse (reverse proxy) via Nginx.
Authentification & sécurité avancée
- Double système de session robuste combinant cookies en mémoire et jetons JWT persistants.
- Intégration OAuth 2.0 fluide avec l’API de l’École 42.
- Authentification à deux facteurs (TOTP) pour une sécurité renforcée.
- Validation rigoureuse de l’état des sessions et sécurisation de toutes les routes de l’API.
Profils utilisateurs Ă©tendus
- Personnalisation complète de l’interface (avatar, bannières, et thèmes de couleurs personnalisés).
- Suivi de statistiques de jeu approfondies (expérience, victoires totales, séries de victoires).
- Gestion des relations sociales complexes (demandes d’amis, blocage d’utilisateurs).
Au-delĂ des exigences
Bien que le cahier des charges de base de Transcendance soit déjà particulièrement exigeant, j’ai délibérément choisi d’aller beaucoup plus loin. Là où le sujet demandait simplement des fonctionnalités fonctionnelles, j’ai visé l’excellence technique, la créativité et une finition digne d’un véritable produit en production, offrant une expérience nettement supérieure à ce qui était attendu.
Défi clé
Construire une API complète et interconnectée. La véritable complexité résidait dans la création et la gestion des comptes, couplées à un système social robuste : chat en direct avec salons et messages privés, et un système d’invitations fluide transitant du jeu vers le chat externe.
Le framework serveur Colyseus a été utilisé pour gérer les salons d’attente (lobbys) et la couche de connexions réseau, mais l’entièreté de la logique du jeu (moteur physique, détection des collisions, synchronisation de l’état en temps réel) a été conçue et développée de zéro pour le backend et le client.
RĂ©sultat
Une application prête pour la production démontrant une maîtrise complète (full-stack) : j’ai conçu le modèle de données, construit chaque point de terminaison d’API, implémenté la communication en temps réel, sécurisé l’authentification, et déployé l’ensemble dans Docker.
Context
Transcendance is the final project of the École 42 common core curriculum. It is designed to be completed in a team of 5 students. As no one was available at the time, I had to complete most of the project on my own. However, I was able to get assistance from a peer toward the end of the project with a few tasks.
This meant I was responsible for every aspect of the project: frontend, backend, authentication, real-time communication, database design, Docker containerization, and the overall architecture.
Tech stack
- Frontend: Vue.js 3 with Vuetify (Composition API, Pinia, Vue Router)
- Backend: NestJS (TypeScript)
- Game engine: Cocos Creator (Client) and cannon-es (Server Physics)
- Real-Time & Network: Colyseus (Multiplayer server framework)
- Authentication: 42 OAuth + JWT
- Database: PostgreSQL with Sequelize
- Infrastructure: Docker Compose
What I built
Game engine
- Real-time Pong with server-side physics simulation
- Synchronized client rendering via WebSocket
- Spectator mode
Infrastructure & modular backend
- Fully containerized with Docker Compose (one command to start the entire infrastructure).
- Highly modular backend architecture, cleanly separating authentication, gameplay, chat, and player management.
- Dynamic relational database management and automatic schema synchronization.
- Nginx reverse proxy.
Advanced authentication & security
- Robust dual session system combining secure in-memory cookies and persistent JWT tokens.
- Seamless OAuth 2.0 integration with the École 42 API.
- Two-factor authentication (TOTP) for enhanced security.
- Rigorous session state validation securing all API endpoints.
Extended user profiles
- Complete profile customization (avatars, banners, and custom color themes).
- Deep game statistics tracking (experience, total victories, win streaks).
- Complex social relationship management (friend requests, user blocking).
Going beyond the requirements
While the base requirements for Transcendance are already highly demanding, I deliberately chose to push the boundaries much further. Where the subject asked for functional features, I aimed for technical excellence, creativity, and a level of polish expected in a real production product, delivering an experience significantly superior to what was strictly required.
Key challenge
Building a complete and interconnected API. The real complexity lay in account creation and management, coupled with a robust social system: live chat with rooms and private messages, and a seamless invitation system transitioning from the game to the external chat.
The Colyseus server framework was used to handle lobbies and the network connection layer, but the entirety of the game logic (physics engine, collision detection, real-time state synchronization) was designed and developed from scratch for both the backend and client.
Result
A production-ready application demonstrating complete full-stack mastery: I designed the data model, built every API endpoint, implemented real-time communication, secured authentication, and deployed everything in Docker.