Transcendence

screenshot of Transcendence
nestjs
react
scss
tailwind

This project comes in as the final big project of the 42 network common core, that consists of a complete web single page application. It serves real-time multiplayer online game, a chat, a dashboard and many more other cool stuff.

Overview

The Pong Game Web Application is a dynamic and engaging platform that combines a classic game with real-time multiplayer capabilities. Developed as a capstone project within the 42 network, this application seamlessly integrates a fun Pong gaming experience with a robust chat feature, allowing users to connect and communicate while they play. Built using advanced technologies like TypeScript for both the backend (NestJS) and frontend (React TypeScript), with PostgreSQL as its database, the app offers an interactive and user-friendly experience enhanced by real-time connections through socket.io.

The main attraction of this application is the synchronous gameplay that allows users to engage in live matches with opponents worldwide. In addition to the gaming aspect, the chat functionality enriches the user experience by enabling communication and social interactions, catering to both casual gamers and those looking for a competitive edge.

Features

  • Real-Time Multiplayer: Users can enjoy live Pong matches against opponents thanks to seamless real-time connection powered by socket.io.

  • Matching System: Automatically matched with other players through a sophisticated matchmaking system, ensuring quick and fair games.

  • Game Customization Options: Players can customize their gaming experience with unique features like hiding the ball, altering its trajectory, and adjusting its speed.

  • Chat Functionality: Users can create chat rooms (public, private, or password-protected) to communicate and strategize with friends or other players.

  • User Control: Channel owners have administrative powers, allowing them to manage password settings, kick or ban users, and promote others to admins.

  • Direct Messaging: Players can send direct messages to other users, enhancing interaction outside of the game.

  • Block Feature: Users can block accounts to avoid unwanted messages, creating a more comfortable communication environment.

  • Invitation to Play: The chat interface allows users to easily invite friends to join a Pong game, fostering a more connected gaming community.

nestjs
Nest

A progressive Node.js framework for building efficient, scalable, and enterprise-grade server-side applications with TypeScript/JavaScript.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

scss
SCSS

SCSS is a preprocessor scripting language that extends the capabilities of CSS by adding features such as variables, nesting, and mixins. It allows developers to write more efficient and maintainable CSS code, and helps to streamline the development process by reducing repetition and increasing reusability.

tailwind
Tailwind

Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.

docker
Docker

A website that uses Docker for containerization to streamline development, testing, and deployment workflows. This includes features such as containerization of dependencies, automated builds and deployments, and container orchestration to ensure scalability and availability.

postcss
Postcss

PostCSS is a popular open-source tool that enables web developers to transform CSS styles with JavaScript plugins. It allows for efficient processing of CSS styles, from applying vendor prefixes to improving browser compatibility, ultimately resulting in cleaner, faster, and more maintainable code.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.