https://github.com/md-emon-hasan/tic-tac-toe-with-ai
🎮 Web-based game that allows users to compete against a smart AI opponent, utilizing Flask for the backend and Bootstrap for frontend.
https://github.com/md-emon-hasan/tic-tac-toe-with-ai
ai flask-application minmax-algorithm python python-project tic-tac-toe tic-tac-toe-game
Last synced: 9 months ago
JSON representation
🎮 Web-based game that allows users to compete against a smart AI opponent, utilizing Flask for the backend and Bootstrap for frontend.
- Host: GitHub
- URL: https://github.com/md-emon-hasan/tic-tac-toe-with-ai
- Owner: Md-Emon-Hasan
- License: mit
- Created: 2024-10-23T16:02:39.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2024-10-23T16:27:37.000Z (about 1 year ago)
- Last Synced: 2025-01-13T08:46:21.708Z (11 months ago)
- Topics: ai, flask-application, minmax-algorithm, python, python-project, tic-tac-toe, tic-tac-toe-game
- Language: HTML
- Homepage: https://tic-tac-toe-with-ai.onrender.com/
- Size: 7.81 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🎮 Tic Tac Toe with AI
Welcome to the **Tic Tac Toe with AI** repository! This project is a web-based application that allows users to play the classic Tic Tac Toe game against an AI opponent. The application is built using Flask, Bootstrap, and integrates animations for a smooth and engaging user experience.
## 📋 Contents
- [Introduction](#introduction)
- [Features](#features)
- [Technologies Used](#technologies-used)
- [Getting Started](#getting-started)
- [Directory Structure](#directory-structure)
- [How to Play](#how-to-play)
- [AI Algorithm](#ai-algorithm)
- [Deployment](#deployment)
- [Contributing](#contributing)
- [License](#license)
- [Contact](#contact)
---
## 📖 Introduction
This repository contains a Tic Tac Toe game that features a playable AI opponent. The game logic is implemented using Python with the Flask web framework, and the user interface is designed using Bootstrap for a responsive layout.
---
## ⭐ Features
- Play Tic Tac Toe against a smart AI.
- User-friendly interface with smooth animations.
- Responsive design for various screen sizes.
- Game restart functionality.
- Displays the winner or a draw message.
---
## 🛠️ Technologies Used
- **Frontend:** HTML, CSS, Bootstrap
- **Backend:** Flask (Python)
- **AI:** Minimax algorithm for optimal gameplay
- **Deployment:** Render for cloud hosting
---
## 🚀 Getting Started
To get started with this project, follow these steps:
1. **Clone the repository:**
```bash
git clone https://github.com/Md-Emon-Hasan/Tic-Tac-Toe-with-AI.git
```
2. **Navigate to the project directory:**
```bash
cd Tic-Tac-Toe-with-AI
```
3. **Create a virtual environment and activate it:**
```bash
python -m venv venv
source venv/bin/activate # On Windows use `venv\Scripts\activate`
```
4. **Install the dependencies:**
```bash
pip install -r requirements.txt
```
5. **Run the application:**
```bash
python app.py
```
6. **Open your browser and visit:**
```
http://127.0.0.1:5000/
```
---
## 📂 Directory Structure
```
Tic-Tac-Toe-with-AI/
├── app.py # Main Flask application
├── static/ # Static files (CSS, JS, images)
│ ├── style.css # Custom CSS styles
│ └── script.js # JavaScript for game logic
├── templates/ # HTML templates
│ └── index.html # Main game interface
├── requirements.txt # Python dependencies
└── README.md # Project documentation
```
---
## 🎮 How to Play
1. Open the application in your web browser.
2. Click on any cell in the grid to place your move.
3. The AI will automatically make its move.
4. The game continues until there is a winner or a draw.
---
## 🤖 AI Algorithm
The AI opponent uses the **Minimax algorithm** to determine its moves. This algorithm evaluates all possible moves and selects the one that maximizes its chances of winning while minimizing the user's chances.
---
## 🌐 Deployment
To deploy this application on a cloud platform like Render:
1. **Sign up for Render:** Visit [Render](https://render.com) and create an account.
2. **Create a new Web Service:** Connect your GitHub repository and select your main branch.
3. **Configure Build Settings:** Set the build command to `pip install -r requirements.txt` and the start command to `python app.py`.
4. **Deploy:** Render will automatically build and deploy your application. You will receive a live URL for your app.
---
## 🤝 Contributing
Contributions are welcome! Here's how you can contribute:
1. **Fork the repository.**
2. **Create a new branch:**
```bash
git checkout -b feature/new-feature
```
3. **Make your changes.**
4. **Commit your changes:**
```bash
git commit -m 'Add a new feature or fix a bug'
```
5. **Push to the branch:**
```bash
git push origin feature/new-feature
```
6. **Submit a pull request.**
---
## 📝 License
This project is licensed under the [MIT License](https://opensource.org/licenses/MIT). See the [LICENSE](LICENSE) file for more details.
---
## 📬 Contact
- **Email:** [iconicemon01@gmail.com](mailto:iconicemon01@gmail.com)
- **WhatsApp:** [+8801834363533](https://wa.me/8801834363533)
- **GitHub:** [Md-Emon-Hasan](https://github.com/Md-Emon-Hasan)
- **LinkedIn:** [Md Emon Hasan](https://www.linkedin.com/in/md-emon-hasan)
- **Facebook:** [Md Emon Hasan](https://www.facebook.com/mdemon.hasan2001/)
---
Feel free to adjust any sections to better reflect your project and its features!