Tic Tac Toe

A full-stack multiplayer Tic Tac Toe game built with React (using Vite).

Features

• Real-time Multiplayer: Play Tic Tac Toe with friends
• Game Validation: Join games with a name and optional avatar.
• Room Management: Create and join game rooms, handle disconnects, and reset games.
• Modern UI: Clean and responsive design using TailwindCSS.

Tech Stack

• Frontend: React, JavaScript, Vite, TailwindCSS
• Backend: Node.js, Express, Socket.IO
• Real-time Communication: Socket.IO

Setup and Installation

Prerequisites

• Node.js
• npm

Setup

1. Clone the repository

git clone https://github.com/minhphung152/tic-tac-toe.git

2. Navigate to the server folder and install dependencies

cd server
npm install

3. Start the server

node server.js

4. Navigate to the client folder and install dependencies

cd client
npm install

5. Start the client application

npm run dev

Usage

1. Open http://localhost:5173 in your browser.
2. Enter a Room Name, your Name, and optionally an Avatar URL.
3. Click Join Game.
4. Open the same URL in another browser window or tab, and join using the same room name with a different name/avatar.
5. Click on the board to make your moves. The game will display the next turn, and notify when someone wins or if the game is a draw.
6. When the game ends, click Reset Game to play again.

Authors

• Minh Phung - GitHub
• Duc Nguyen - GitHub