0xmetaschool/ TicTacToeGPT

Build your own TicTacToe game using TicTacToeGPT Template. Free template for developers to customize and build upon.

TicTacToeGPT

TicTacToeGPT brings the classic game to life with a smart AI opponent and customizable gameplay. Challenge yourself with different board sizes and AI difficulties to improve your strategic thinking.

Built with Next.js and OpenAI, this open-source template lets developers create their own version of an AI-powered Tic Tac Toe game. Features include user accounts, multiple board sizes (3x3 to 5x5), and three AI difficulty levels to match your skill.

Live Demo

https://tic-tac-toe-gpt.vercel.app/

Features

  • Smart AI opponent with multiple personalities through OpenAI integration and adaptive difficulty levels (easy/medium/hard)
  • Expandable game boards up to 5x5 with real-time move validation and win detection algorithms
  • Comprehensive player stats dashboard tracking win rates, game duration, and performance analytics
  • Modern responsive UI with smooth animations and customizable game settings

Technologies Used

  • Next.js and React for Frontend and Backend
  • Tailwind CSS for Styling
  • OpenAI API for AI-Powered Features

Use Cases

  • An educational tool for students to learn strategy through AI gameplay
  • A stats platform to track player progress and analyze game patterns
  • A training system to practice advanced moves on larger game boards

Installation Steps

1. Clone the repository:

1 2 git clone https://github.com/0xmetaschool/tic-tac-toe-gpt.git cd tic-tac-toe-gpt

2. Install dependencies:

1 npm install

3. Set up the database: Ensure you have MongoDB installed and running on your system, or use a cloud-hosted MongoDB service like MongoDB Atlas. Create a new Cluster, select a free plan, and copy the connection string, this will be required in the next step.

4. Set up environment variables: Create a .env.local file in the root directory and add:

1 2 3 4 MONGODB_URI= JWT_SECRET= OPENAI_API_KEY= NEXT_PUBLIC_API_URL=http://localhost:3000/api

5. Run the development server:

1 npm run dev

6. Open your browser and navigate to http://localhost:3000

Screenshots

TicTacToeGPT Template Landing Page screenshot TicTacToeGPT Template Home Page screenshot
TicTacToeGPT Template Game Page screenshot

How to use the application

  1. Sign in using your email and password.
  2. Choose your board size and difficulty level
  3. Click "Start Game" to play with AI.
  4. Make your move and start playing the game.
  5. After the game you either go back to the main page or play again.
  6. Game stats will be updated on the main page after every game.

Contributing

Contributions are welcome! Here's how you can help:

  1. Fork the project
  2. Create your feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

License

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

Contact

Please open an issue in the GitHub repository for any queries or support.

Select a file to view its content

Downloads

0

Version

1.0.0

License

MIT

Platform

GPT-4o

Contributors 1
aveek-goyal
Open in

Last updated 3 days ago

We are a open source platform and encourage community to contribute to these templates!