Tic-Tac-Toe Web Application

To build a Tic-Tac-Toe web application, we use HTML, CSS, and JavaScript. The game is interactive and allows users to play either against each other or against an AI opponent. The goal is to get three markers in a row to win the game. This app tracks game states, handles user clicks, and checks for winning conditions.

Deployment

The project is live and accessible at the following link:
Tic-Tac-Toe Web App Live Demo

Features

• Player vs Player Mode: Play against a friend on the same device.
• Player vs AI Mode: Play against the AI using an intelligent decision-making algorithm.
• Game Status Updates: The app shows whose turn it is and announces the winner or draw.
• Reset Game: Start a new game with an empty grid after the game ends.
• Winning Line Animation: A line is drawn to highlight the winning combination.

Technologies Used

• HTML5: Structure of the game page and grid layout.
• CSS3: Styling, including grid design and animations.
• JavaScript: Handles game logic, user interactions, and AI decision-making.

How It Works

1. Game Initialization:

   • The game starts with an empty 3x3 grid. Players can choose to play in either Player vs Player mode or Player vs AI mode.

2. User Moves:

   • Players take turns by clicking on empty cells in the grid. Player 1 uses X and Player 2 uses O (or AI in case of the AI opponent).

3. AI Mode (Minimax Algorithm):

   • In Player vs AI mode, the AI opponent makes its moves using the Minimax algorithm. The algorithm evaluates all possible moves and selects the optimal one based on minimizing potential losses and maximizing winning chances.

4. Winning Condition:

   • The game checks after every move if a player has achieved three markers in a row, vertically, horizontally, or diagonally.
   • If all cells are filled and no player wins, the game ends in a draw.

5. Game Status:

   • The current player's turn is displayed, and once the game ends, the result (win or draw) is shown.

6. Reset Game:

   • After the game concludes, players can start a new game by clicking the Reset Game button.

Installation

To run this project locally:

1. Clone the Repository
   Clone the project repository to your local machine:

   git clone https://github.com/shivlalsharma/PRODIGY_WD_03.git

2. Navigate to the Project Directory
   Change to the project directory:

   cd PRODIGY_WD_03

3. Open in Browser
   Open the index.html file in your web browser:

   open index.html

   Alternatively, you can right-click the file and select "Open With" > "Browser."

4. Customize (Optional)
   Modify the HTML, CSS, or JavaScript files to customize the menu style or behavior according to your preferences.

License

This project is licensed under the MIT License. See the LICENSE file for details.

Author

Created and deployed by Shivlal Sharma.

• GitHub: GitHub
• LinkedIn: LinkedIn