VehiclesFashionRecipesBlogsHuntTravelsSportFunHandmadeITEducation
Mini-Games
x

x
zakruti.com » IT - Software » freeCodeCamp.org
JavaScript Tic Tac Toe Project Tutorial - Unbeatable AI w/ Minimax Algorithm

JavaScript Tic Tac Toe Project Tutorial - Unbeatable AI w/ Minimax Algorithm

FBTwitterReddit

video description

Rating: 4.0; Vote: 1
A full web development tutorial for beginners that demonstrates how to create an unbeatable tic tac toe game using vanilla JavaScript, HTML, and CSS. Learn the Minimax algorithm! - Part 1: Introduction (0:00) Code: none - Part 2: HTML (2:58) Code: https://github.com/beaucarnes/fcc-project-tutorials/tree/master/tictactoe/2 - Part 3: CSS (4:23) Code: https://github.com/beaucarnes/fcc-project-tutorials/tree/master/tictactoe/3 - Part 4: JavaScript: Basic Setup (10:28) Code: https://github.com/beaucarnes/fcc-project-tutorials/tree/master/tictactoe/4 - Part 5: JavaScript: Determine Winner (20:32) Code: https://github.com/beaucarnes/fcc-project-tutorials/tree/master/tictactoe/5 - Part 6: JavaScript: Basic AI & Winner Box (30:45) Code: https://github.com/beaucarnes/fcc-project-tutorials/tree/master/tictactoe/6 - Part 7: JavaScript: Minimax Algorithm (39:25) Code: https://github.com/beaucarnes/fcc-project-tutorials/tree/master/tictactoe/7 --- Special thanks to David Daly and myloginistaken who found a mistake where the game sometimes incorrectly shows a tie game. The 'Part 7' GitHub code now contains this fix. -Minimax article: https://medium.freecodecamp.org/how-to-make-your-tic-tac-toe-game-unbeatable-by-using-the-minimax-algorithm-9d690bad4b37 - Beau Carnes on
Date: 2022-03-14

Comments and reviews: 10


Nice tutorial thanks. However just a side note here: at 38:59 it was not a tie game, you actually won the game but the program did not stop when you won, rather it continued to evaluate if(!checkTie()) which caused the declareWinner(-Tie Game-) to execute. I fixed this by having a global variable -var finish= null-. I set this var to true once I win the game, and I add it to be checked at if(!finish && !checkTie()).-
This var will also fix the scenario of the computer still playing his turn even though you won the game.
Of course this var needs to be reset to false once you click on reset otherwise the computer wont play his turns next game.

reply

After Part 6, the program will still say it wins if you select the entire middle row. You just select the 4th box, then 5th box, and then 6th box. The computer program will select the 1st, 2nd, and 3rd box after you but it still says it wins... What will fix this if you have the random bot?
reply

Complex, but very iteresting and beneficial project. I have been watching and trying to code like 5 or 7 times)) Now, I am starting to understand... After coding them myself maybe the same times) I hope I can write similar codes on my own.
Thanks a lot for this tutorial.

reply

Great video!
But the checkTie function needs improvement even before adding minimax algorithm.
The current logic first checks for empty squares and then for a win. But it is entirely possible to win when all the last square has been filled.

reply

In part 6, there is one bug, both winners highlight at step 3 if you keep selecting from 2nd or 3rd rows.
Adding one more condition works for me.
if (!checkTie() && !checkWin(originalBoard, humanPlayer))
turn(bestSpot(), aiPlayer);

reply

This video has been helpful for not only getting a better understanding of how functions calling other functions works, but also for getting a better understanding of how algorithms work, thank you
reply

I always dreamed of that these robots that could control themselves with AI was just mind blowing.
Now I couldn't believe that I am only creating this AI.
Thank you very much!
-MIND BLOWN-

reply

There are many bugs.
the code is great but lengthy, doesn't take the fastest route possible and
an example of the bug is
go to 39:00
it says tie game whereas the human won

reply

This code before the ai functions in place has a problem. If human player wins at the last move the system return -Tie Game-
checkTie finction needs to be readdressed here

reply

Every time the game ends with all the cells values === numbers, the result will be -Tie Game-. After verify the cells values, you have to check if any player had won the game.
reply
Add a review, comment






Other channel videos