A program that can always win or draw a 3x3 tic-tac-toe game. This was implemented using the minimax algorithm as well as Alplha-Beta pruning to speed up the process. This User Interface was built using React.js.

Structure

You can find most of the functions of the algorithms inside nextMove.js inside the src folder. In addition, I have also created calculateWinner() and isFull() function. All the React components are inside index.js as I followed React.js tutorial on their website at first.

Hosting

This project is hosted on Netlify. Check the game out at https://scottlai.codes

Local Installation

This project uses create-react-app, so you'll need to install npm

1. Change your directory into the project folder and type npm install in your terminal / command line

2. Run npm start and the website is hosted on port 3000 (localhost:3000)

Credit

I learnt about the minimax algorithm and alpha-beta pruning technique through YouTube and Wikipedia. I also used React tutorial on their website as boilerplate code. However, I have modified the code as I progressed through the project.

• Sebastian Lague: https://www.youtube.com/watch?v=l-hh51ncgDI
• MIT OpenCourseWare: https://www.youtube.com/watch?v=STjW3eH0Cik
• Wikipedia: https://en.wikipedia.org/wiki/Minimax
• React.js Tutorial: https://reactjs.org/tutorial/tutorial.html