/tic-tac-toe

A unbeatable tic tac toe game!

Primary LanguageJavaScriptOtherNOASSERTION

Tic Tac Toe

This is an unbeatable game of tic-tac-toe. The human player can either start the game by changing to the 'O' team (the AI will be 'X' and make a move) or simply making a move by clicking on a cell on the board.

Getting Started

Check out the live demo!

Built With

  • HTML/SCSS
  • ES6 JavaScript
  • Gulp for automating tasks
  • Babel for converting ES6 to ES5
  • No JS or CSS libraries

Objectives

This project is one of the advanced front end projects for freeCodeCamp.

The three user stories that must be fulfilled are:

  1. I can play a game of Tic Tac Toe with the computer.
  2. My game will reset as soon as it's over so I can play again.
  3. I can choose whether I want to play as X or O.

My personal objectives for this project were:

  1. Use no JavaScript libraries or frameworks
  2. Structure my JS using MVC. Multiple files were used to maintain a separation of concerns.
  3. Use a constructor function and prototype methods to encapsulate data and associated methods.
  4. Make my tic tac toe game unbeatable using the minimax algorithm and optimizing the algorithm using alpha-beta pruning.
  5. Try to ensure my code is well commented and readable.
  6. Refrain from using any CSS/JS libraries or frameworks.

Final Thoughts

This project was pretty challenging but overall I had fun and it was a great learning experience!

This project wasn't massive by any means but I iteratively keep getting better and better at approaching my work. While I planned out certain parts of my projects there were a couple of areas that I [unknowingly] neglected to address. I will continue to strive to fully understand the problem I am trying to solve and plan my work more thoroughly in the future.

I also would like to learn more about design and architecture. While I separated my scss and JS in to multiple partial files, and adopted the MVC approach I feel like I can still improve in this area. Just like Haverbeke said in Eloquent JavaScript, "The art of programming is the skill of controlling complexity. The great program is subdued—made simple in its complexity."

License

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

Acknowledgments

  • I used Google's tic tac toe as inspiration for the design of my project
  • I would like to thank GeeksforGeeks for (in my opinion) having the best articles on the minimax algorithm