PongTheGame App

This project is about creating a website for the mighty Ping Pong contest.
It is based on the final team-project "ft_transcendence" of Ecole 42 Common Сore educational program.
PongTheGame App:

• includes user account and a real-time multiplayer online game;
• uses a PostgreSQL database;
• Backend is written in NestJS, Frontend - with React TypeScript.

The game is available on www.pongthegame.rocks (or direct IP address)

Demonstration

PongTheGame is a single-page Web App with responsive design:

FirstTouch.mp4

PongTheGame provides user interface:

• Any user is able to login using the OAuth system of 42 intranet or Github;
• Users are able to choose unique nicknames, delete and upload avatars, enable two-factor authentication and check their match history and achievement.

ProfileManagement.mp4

PongTheGame allowes users to train with Artificial Intelligence:

TrainingWithAI.mp4

But the main purpose of this website is to play Ping Pong versus other players.
Users are able to play classic game with a random online player or invite a specific player to join customized game.
Users can follow, block or invite other users and see their current status (online, offline, playing, preparingToPlay):

Invitation.mp4

Users are also able to spectate other players' games:

Spectate.mp4

Game itself is a canvas game and it is also responsive:

ResponsiveDesign.mp4

Requirements

• Internet
• installed Docker (to run production build on your machine)
• installed Makefile (to run in development mode)

How to use

To try Pong the Game:

Just proceed to the site www.pongthegame.rocks

To run the production build of the app on your computer:

1. Modify .env file into the root directory of the App
   (follow the detailed setup instuction in doc/setup_production.md)
2. Run cmd:

docker compose up --build

3. Open http://SERVER_NAME:FRONTEND_PORT to play Pong The Game in your browser.
4. To clean up the System of all files created by PongTheGame use cmd:

docker system prune --volumes --all --force

To run the app in development mode on your computer:

1. Modify .env file into the root directory of the App
   (follow the detailed setup instuction in doc/setup_development.md)
2. Run cmd:

make

or

docker compose -f docker-compose.yml -f docker-compose.dev.yml up -d --build

3. Open http://SERVER_NAME:FRONTEND_PORT to play Pong The Game in your browser.
4. To clean up the System of all files created by PongTheGame use cmd:

make fclean

or

docker-compose down --rmi all --volumes --remove-orphans
rm -rf ./backend/dist
rm -rf ./backend/node_modules
rm -rf ./frontend/node_modules