Back to projects

42 project

Transcendence

A full-stack web application around a multiplayer game, combining product thinking, architecture and real-time features.

Stack

  • Next.js
  • TypeScript
  • NestJS
  • PostgreSQL
  • WebSocket
  • Docker

Skills gained

  • Structuring a full-stack application as a team
  • Handling real-time flows with WebSocket
  • Designing a user experience around an interactive product
  • Collaborating on a more complex front/back architecture

Transcendence is a complete team-built web project around a multiplayer game. It combines authentication, user management, real-time features, front/back architecture and product experience. It is a pivotal project because it requires both technical skills and collective organization.

01 — Product

Turning a technical subject into a real experience.

Transcendence is not just about making a game work. It also requires thinking about the surrounding experience: sign-up, profile, matchmaking, interactions, navigation and user feedback. The project pushes you to think as a developer, but also as a product designer.

Humorous illustration of a multiplayer web product being built
Fig. 01
When you wanted to code Pong and end up designing a tiny social platform.

02 — Real-time

Making users communicate without breaking the experience.

The real-time part requires a different way of thinking. States change quickly, several users interact at the same time and every delay becomes visible. This forces better handling of synchronization, events and interface transitions.

Humorous illustration of two clients synchronized in real time
Fig. 02
Real-time: when a bug only happens while someone is watching.

03 — Team

Building architecture multiple people can understand.

The main challenge of a team project is rarely only technical. You need to agree on conventions, responsibilities, front/back interfaces and priorities. Transcendence helped me improve technical communication and collective architecture work.

Humorous illustration of a team aligning front-end and back-end
Fig. 03
The real final boss: naming routes, events and Git branches.