This project has been created as part of the 42 curriculum by ahentton, shachowd, eelaine, fsolomon, hitran .
Pong is a full-stack web application built as the final team project at Hive Helsinki (42 Network).
The project combines real-time gameplay with friends and AI, user management, secure authentication and focuses on modern backend architecture, secure API design, and containerized deployment.
| Feature | Description | Responsible User(s) |
|---|---|---|
| User Management | Registration, login, profile update, avatar change | Shahnaj, Finnan, Eetu |
| Secure Authentication | JWT + cookie-based login and authentication | Anselmi, Trung, Eetu |
| Play Real-Time Game | Pong matches with friends through real-time matchmaking and AI opponents | Trung, Eetu, Anselmi |
| Friend Management | Manage friend requests, search friends, see online status | Finnan, Shahnaj |
| Containerized Deployment | Dockerized multi-service deployment for easy setup | Trung, Shahnaj |
| Deployment Infrastructure | Reverse proxy and https/tls termination | Anselmi |
REST API: Used for predictable CRUD operations (authentication, profiles, friends, avatar management).
WebSocket: Used for real-time bidirectional communication during gameplay and matchmaking.
HTTP/HTTPS: HTTPS is used for secure client-to-server communication and all backend operations via Nginx. Communication between frontend and game services within the Docker network uses HTTP. HTTP is also responsible for carrying JWT authentication cookies.
Nginx: Acts as a reverse proxy, routing requests to backend services and handling TLS termination.
Data Format (Notation): JSON for API communication and Markdown for project documentation.
- Docker (install)
- Docker Compose (install)
- Make tool (install)
- Rename .env_example file as .env and update credentials
- Make sure port 3000 and 8443 are not in use
- Clone git repository in your local directory
git clone git@github.com:AnselmiVeikko/ft_transcendence.git- Build and start all the docker containers
cd ft_transcendence
make runNavigate (Note: You may receive a security warning because the site uses a self-signed TLS certificate. Click “Advanced” and then “Proceed to localhost (unsafe)” to continue browsing)
https://localhost:8443
To stop and remove all the containers and volumes run
make clean
| Name | GitHub | Thematic Role | Responsible For |
|---|---|---|---|
| Anselmi Veikko | AnselmiVeikko | Project Manager (PM) | Backend Development |
| Finnan Solomon | finye | Product Owner (PO) | Frontend Development |
| Trung Tran | tranhieutrung | Technical Lead, Game | Game Development |
| Eetu Laine | eetulaine | Technical Lead, Frontend | Frontend Development |
| Shahnaj Chowdhury | shahnajsc | Technical Lead, Backend | Backend Development |
For this project, we mainly used discord for communication. We would have weekly meetings, with the date decided by vote. In said meetings, we went over current tasks and split the workload. We used GitHub Projects for logging progress and current tasks.
- Designing the schema/response infrastructure for the backend.
- Creating Login/logout endpoints.
- Security features like JWT authentication via cookies, reverse proxy, https/tsl termination.
- Game logic on main backend; tracking match status, crafting a smooth matchmaking system.
- ToS & Privacy policy.
- Mapping out progress and urgent tasks in meetings.
I faced many challenges during this project, here are the major ones listed:
- Learning typescript & general rest API fundamentals.
- Learning standard practices for authentication and general security.
- Reviewing others code on an unfamiliar stack.
- Setting up and structuring the initial backend server.
- Designing and implementing the database schema for user and friend management.
- Integrating Prisma ORM into backend services.
- Developing REST API endpoints for
- User management: registration, profile update, avatar change, profile view.
- Friend management: sending, accepting, declining, deleting friend requests, and friends search, suggestion, pending request.
- Designing avatar upload handling with validation, image processing, and Docker volume based storage.
- Containerizing the backend service using Docker and Docker Compose
- Facilitating team meetings.
- Structuring the backend architecture.
- Working with Prisma ORM.
- Designing consistent and maintainable REST APIs.
- Handling secure file uploads and containerized storage environments.
- Designed and implemented the real-time Pong game module.
- Built game backend (Express + ws) with server-authoritative physics and state management.
- Implemented WebSocket-based multiplayer synchronization.
- Developed AI opponent using trajectory prediction with controlled reaction delay.
- Integrated game service with main backend for authentication and match result persistence.
- Real-time synchronization and fairness.
- AI balancing.
- Secure inter-service communication.
- Implemented frontend anguage switching support
- Fixed cross-browser compatibility
- Contributed to user management features on the frontend
- Worked on authentication flows (JWT + cookie-based login)
- Developed responsive UI components
- Learning to use typescript in a large frontend project
- Ensuring accessibility and usability for international users
- Understanding browser compatibility issues
- Integrating authentication and user management securely on the frontend
- Implemented a friends system on Frontend (add/remove friends, friends list, pending requests, and friend suggestions)
- Advanced search functionality with pagination, status filters and sorting
- JWT cookie refresh on frontend
- Implemented reusable Header component and protected routes with 404 page redirection
- Responsive UI components with dark mode support
- Managing state across multiple asynchronous operations
- learning Tailwind css and typescript
- Addressing UI issues related to responsive design
AI usage:
- Learning standard practices in API building.
- Learning typescipt syntax.
- Learning trade-offs between different practices.
- Seeking optimized solutions accomodating modern standards.
- Repetitive tasks, like writing simple schemas etc.
- Structuring secure authentication across multiple services (JWT validation, HTTP-only cookies, token verification across WebSocket connections).
- Debugging assistance and concept clarification during development.