Tic-Tac-Toe Game

A simple Tic-Tac-Toe game built using React and TypeScript.

Features

• Interactive Tic-Tac-Toe board
• Turn-based gameplay
• Responsive UI
• Component-based React structure
• Built with TypeScript

---

Tech Stack

• React
• TypeScript
• CSS

---

Project Setup

Clone the repository:

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

Go into the project folder:

cd tic-tac-toe

Install dependencies:

npm install

Run the development server:

npm start

---

Current Improvements Planned

1. Add Refresh / Restart Button

• Add a button to restart the game instantly.
• Reset board state and winner status.

2. Fix Diagonal Winner Detection

Currently diagonal wins are not detected properly.

Planned fixes:

• Left diagonal check
• Right diagonal check

Example:

X | O | X
O | X | O
X | O | X

The game should correctly identify diagonal winners.

---

3. Add Player Names

Allow users to:

• Enter User 1 name
• Enter User 2 name

Example:

Player 1: Nikunj
Player 2: Rahul

Display:

Nikunj's Turn

and

Rahul Wins!

---

4. Improve UI

Planned UI improvements:

• Better board styling
• Hover effects
• Winning animation
• Mobile responsiveness
• Dark mode support

---

5. Online Multiplayer Support

Future goal:

• Publish game online
• Allow two random users to play together

Possible technologies:

• Socket.IO
• Node.js
• Express

Future features:

• Create room
• Join room
• Real-time multiplayer
• Online matchmaking

---

Future Ideas

• Score tracking
• AI opponent
• Sound effects
• Game history
• Undo move feature

---

Learning Goals From This Project

• React component structure
• State management
• TypeScript basics
• Event handling
• Conditional rendering
• Game logic implementation

---

Author

Built by Nikunj 🚀