This Tic Tac Toe game is a web application built with Flask, allowing players to play against a computer opponent. It uses HTML, CSS, and JavaScript for the frontend, with Flask serving the backend logic. The AI opponent is constructed using the Minimax Algorithm.
deployment: https://tic-tac-toe-game-i2r0.onrender.com/
- Play Tic Tac Toe against an AI opponent.
- Choose your mark ('X' or 'O') at the beginning of the game.
- The game state is managed through a Flask backend, with player and computer moves processed server-side.
- A reset button to start a new game anytime.
main.py: The Flask backend file.tictactoe.py: Contains theTicTacToeclass, managing the game state and AI bot strategy.static/css/style.css: CSS file for styling the web pages.static/js/script.js: JavaScript file for handling user interactions and AJAX requests.templates/index.html: The HTML template for the game interface.
- Upon visiting the website, choose your mark ('X' or 'O') by selecting the corresponding radio button and clicking the "Submit" button.
- Click on any cell in the grid to make your move.
- The AI opponent will automatically make its move after you.
- The game ends when one player wins by aligning three of their marks vertically, horizontally, or diagonally, or when all cells are filled, resulting in a draw.
- Click the "Reset Game" button to start a new game at any time.
- Backend: Flask
- Frontend: HTML, CSS, JavaScript
- Game Logic: Minimax Algorithm using Python
The Tic Tac Toe AI opponent runs thanks to the Minimax algorithm to determine the best move optimally.
The Minimax algorithm works by exploring all possible moves in the game and choosing the move that maximizes the player's chance of winning while minimizing the AI's chance. Here's a simplified explanation of the algorithm:
-
Base Case: The recursion ends when the function encounters a terminal state:
- If the AI (
self.pc) wins, return1. - If the player wins, return
-1. - If the board is full (draw), return
0.
- If the AI (
-
Recursive Case: For each potential move, the algorithm recursively simulates playing that move, then:
- If it's the AI's turn (maximizing player), it tries to maximize the score.
- If it's the player's turn (minimizing player), it tries to minimize the score.

