Server-side rendering web app that allows users to play the real time multiplayer online game UNO. With its user-friendly interface, the app enables users to create game session to play Uno with a number of players you define. Play UNO in multiple game sessions at the same time and send messages to your friends.
Some of the features UNO Web App offers are the following: Authentication
- User shall be able to sign in/out
- User shall be able to sign up Game management
- User shall be able to create a game session
- User shall be able to see the list of available game sessions
- User shall be able to join a game session
- User shall be able to play Uno within a game session Chat management
- User shall be able to send messages in the chat within a specific game session
- User shall be able to send messages in the chat within the main lobby for everybody
| Category | Name |
|---|---|
| Front-end | HTML, CSS, Vanilla JavaScript |
| Back-end | JavaScript (NodeJS) |
| Database | PostgreSQL |
| Project Management | GitHub Projects |
| Dependency | Type | Description |
|---|---|---|
bcrypt |
App dependency | NodeJS library used for password hashing |
Express |
App dependency | NodeJS framework for building RESTful APIs |
EJS |
App dependency | Template engine library for NodeJS that allows you to generate HTML markup with plain JavaScript |
Socket IO |
App dependency | Event-driven library for real-time web apps. It enables real-time, bi-directional communication between web clients and servers. |
Postgres migrations (node-pg-migrate) |
App dependency | PostgreSQL database migration management tool. Manage migrations with CLI support for up-down migrations, ensuring smooth database transitions. |
Prettier |
Dev dependency | Opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary. |
Tailwind CSS |
Dev dependency | A utility-first CSS framework |
ESBuild |
Dev dependency | Free and open-source module bundler and minifier for JavaScript and CSS |
Husky |
Dev dependency | Ultra-fast modern native git hooks |
| Branch name | Description |
|---|---|
master |
Root branch. Production-ready branch. Only code that works and has no bugs will be here. |
development |
Child of master. Parent branch of features. Consolidate all features from child branches. |
authentication |
Child of development branch. Only authentication related features will be on this branch. |
game-mgmt |
Child of development branch. Only game management related features will be on this branch. |
chat-mgmt |
Child of development branch. Only chat management related features will be on this branch. |
front-wireframes |
Child of development branch. Only front-end adaptation to wireframes related changes will be on this branch. |
- Have npm package installed
npm install npm@latest -g
- Install PostgreSQL
- Create an empty DB with default settings in the PostgreSQL Server (e.g. mydb)
- Clone the repository
git clone https://github.com/LMAR5/csc867-uno-game-webapp.git
- Go into the new directory
cd csc867-uno-game-webapp
- Create a .env file with the following values:
NODE_ENV=development
PORT=3000
SESSION_SECRET=<your_own_secret_key>
DATABASE_URL=postgresql://[user]:[password]@localhost:5432/<your db name>
- Install NPM packages
npm i
- Run the migrations files to create DB schema
npm run db:migrate
- Run the app
npm run start:dev
- Go to your browser and access localhost:3000
User needs to create an account providing its firstname, lastname, email, and password Stored passwords are encrypted using bcrypt, a cryptographic hashing function.
User access the app by providing its email and password.
If provided credentials doesn't exist, app displays error message.
Lobby where users will see all available game sessions they can join and current session they are part of.
To create a game session the user must provide a name and the number of players for the game.
If number of players is not completed yet, user will see a UNO card facing down waiting for other players.
If number of players is completed, the app assigns 7 UNO cards to each player randomly.
The app validates each play against UNO rules (same color/number/symbol, special cards, etc) and displays error messages for invalid plays or when it's not the user's turn
If a user wins a game session (has 0 cards on hand) the app redirects all players to the game end page, displaying the winner of the game
Send messages to everybody in the lobby and in specific game rooms
