Skip to content

This project is about creating a website for the mighty Pong contest!

Notifications You must be signed in to change notification settings

mariadaan/Transcendence

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Transcendence

HomePage

Table of Contents

Project Overview

A single-page web application with real-time chat functionality

Usage

For our application, Docker needs to be installed on your computer.

To use our application, you must first clone this repository.

git clone https://github.com/AtibQur/Transcendence.git

Optional: If you want to use our test database with a few accounts to add as friends and some chats to join to see the platform in full glory, download the db folder here and place it in the root of this repository, before you run make. If you don't do this, you will start out with an empty database and you will be the first user.

Once you have the source code and Docker is stared on your computer, you can compile it using the provided Makefile.

make

This will start the deployment of our project using Docker Compose.

To launch Prisma Studio run the following command

docker-compose exec backend npx prisma studio

If successfull, Prisma Studio is hosted on localhost:5555. Go to this address in your browser and see a visual editor of all the data in your database. If localhost:5555 remains unavailable, try running npx prisma studio in the terminal of the backend container.

Tech Stack

Technology Description
TypeScript TypeScript enhances JavaScript by adding static typing and other features, helping us catch errors early and improve code quality.
Docker Docker enables containerization, ensuring consistent deployment across different environments. It simplifies the setup process and improves scalability.
Socket.io Socket.io enables real-time, bidirectional communication between clients and the server. This technology fosters interactive features, enhancing user engagement and enabling instant updates.
NestJS A progressive Node.js framework that provides a solid architectural foundation for building efficient and scalable server-side applications.
Prisma Prisma simplifies database access and management through its powerful ORM capabilities. It streamlines interactions with the PostgreSQL database, making data manipulation and retrieval efficient and intuitive.
PostgreSQL PostgreSQL serves as our relational database management system, offering robust data storage, retrieval, and management capabilities.
Bcrypt Bcrypt is a widely used library for hashing passwords, ensuring that sensitive user data remains secure.
Passport and JWT Passport is a versatile authentication middleware that supports various strategies, including JWT (JSON Web Token) authentication. JWT enhances security by securely transmitting information between parties.
Vue Vue.js is a progressive JavaScript framework for building user interfaces. Its component-based architecture empowers us to create dynamic and responsive web applications.
PrimeVue PrimeVue offers a rich set of UI components that seamlessly integrate into Vue applications, enhancing the visual appeal and user experience.
Speakeasy and QR Code Speakeasy facilitates two-factor authentication (2FA) implementation, adding an extra layer of security to user accounts. QR codes streamline the setup process for users, such as 2FA setup.
Axios Axios simplifies HTTP requests, allowing smooth communication between the frontend and backend.

Docker Container Setup

In our project, we've adopted a containerized approach using Docker to ensure consistent and portable deployment. We've set up three containers, each serving a distinct role:

Backend Container:

  • This container hosts the backend of our application powered by NestJS.
  • It's configured to run on port 3000 within the container.

Frontend Container:

  • The frontend of our application, built with Vue.js, resides within this container.
  • The container is configured to listen on port 8080.

Database Container:

  • Our PostgreSQL database is contained within this Docker container.
  • The container communicates via port 5432.

Container

Database Schema

DatabaseSchema

User Account

apis   data-models

apis   data-models

  • Secure Login: Seamlessly log in through OAuth using the 42 intranet, ensuring both accessibility and account security.

  • Customization: Personalize your identity by choosing your own username and avatar, visible across the website.

  • Two-Factor Authentication: Strengthen account security with options like Google Authenticator or SMS verification.

  • Friend Connections: Add other users as friends to stay informed about their online status, gaming activities, and interactions.

  • Stats and Achievements: Showcase your gaming prowess with detailed stats, wins, losses, ladder levels, and achievements displayed on your profile.

  • Match History: Relive your gaming journey through an extensive Match History, encompassing 1v1 games, ladder matches, and more.

Chat

Chat

  • Channel Creation: Create public, private, or password-protected chat rooms tailored to your preferences.

  • Direct Messaging: Establish one-on-one connections with fellow gamers through direct messaging.

  • User Blocking: Exercise control over your interactions by blocking users, ensuring a focused and comfortable environment.

  • Channel Ownership: Initiate channels and become the automatic owner, with the ability to set, change, and manage passwords.

  • Channel Administration: Channel owners can designate administrators, empowering them to maintain a respectful atmosphere and regulate user activities.

  • Invitations and Profiles: Seamlessly send game invitations and access player profiles for a comprehensive understanding of your fellow gamers.

Game

ponglight   pongdark

  • Real-time game: Engage in real-time Pong matches, bringing the classic game to life through seamless online play.

  • Matchmaking: Experience fair and exciting matchups through our automated matchmaking system. Join a queue and get paired with opponents for competitive Pong action.

Security

At our platform, we've implemented a robust system to ensure the protection of user data and privacy. When users log in, we leverage the OAuth system of the 42 network, a trusted and secure authentication mechanism. This means that your login credentials are never directly exposed to our platform, enhancing the overall safety of your account.

To maintain the confidentiality of user information, we employ JSON Web Tokens (JWT) for token-based authentication. JWTs are used to securely store user data and provide a streamlined way to verify a user's identity during their session. These tokens are tamper-proof and cryptographically signed, making them a reliable means of user authentication and authorization.

Furthermore, user passwords are never stored in their original form in our database. Instead, we use the bcrypt hashing algorithm to hash passwords before storing them. Bcrypt is known for its security and resistance to brute-force attacks, adding an additional layer of protection against unauthorized access.

Contributors

Click on us to check out our github!

Haseeb Maria Ster Raav Tessa

About

This project is about creating a website for the mighty Pong contest!

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Vue 51.5%
  • TypeScript 47.8%
  • Other 0.7%