nttanh6299/jungle-board

🐯 A modern Chinese board game with Socket.io, Nextjs, Tailwind, Express, MongoDB, Typescript.

This image is generated from MidJourney

🐯 Jungle board 🦁

This project has been created with the aim of learning new technologies, best practices, problem solving, and other great stuff which are helpful in the future. Mainly focused on the FE part, the BE one was not put much effort (it needs to be polished someday 🐶).

Tech stack

Client

• Nextjs
• Tailwind/HeadlessUI
• Next-auth
• Socket-io
• Zustand/Immer
• Typescript

Server

• Express
• MongoDB
• Socket-io
• Typescript

Service lib

• Jungle board service

Deployment

Client: Vercel Server: Render Service lib: Npm

Features

• Social login (Google, Facebook, Github)
• Play with another player
• Play in anonymous mode
• Cooldown
• Disconnection
• End game
• Join a specific room or auto join
• Create a room
• Buy a board theme
• Exp and coins
• Chat
• Turn logs
• Responsive design
• Localization
• SEO
• Installable app
• Player surrender
• Tournament bracket
• Animation
• Sounds
• AI match

Running app locally

First thing to run is to download the code by cloning the repository:

git clone git@github.com:nttanh6299/jungle-board.git

If you get Permission denied error using ssh, use https link as a fallback:

git clone https://github.com/nttanh6299/jungle-board.git

The project has three installation steps:

Root

Root directory contains editor configuration, and both the server and client folder:

yarn install

Server

The api server, I use Nodejs to power my server:

cd packages/server
yarn install

Client

Frontend SPA folder using Nextjs:

cd packages/client
yarn install

If you standing in the server folder, try to use cd ../server

Don't forget to add your .env file, it contains all of things that are considered secret there.