Starter React JS Project TicTacToe Game from the official react.js tutorial with some minor styling changes.
This project is pretty much the same as the TicTacToe game featured in the **Tutorial** section of the official reactjs documentation, however if you are unfamilar with it, everything you need to know is explained below.
What is TicTacToe?
TicTacToe also known as Noughts and Crosses, or Xs and Os is a paper-and-pencil game for two players who take turns marking the spaces in a three-by-three grid with X or O. The player who succeeds in placing three of their marks in a horizontal, vertical, or diagonal row is the winner. It is a solved game, with a forced draw assuming best play from both players. This game is just a digitized version of the same built using React.js.
Gameplay
TicTacToe is played on a 3*3 grid by 2 players, who alternately place the marks X and O in 1 of the 9 spaces in the grid. The player who manages to create a single, unbroken line of Xs or Os wins.
To get started, simply click on any of the 9 boxes, and the game will start with the first player being X (which cannot be changed as of now) and an X will appear in the box on which the first player has clicked. The game then automatically switches to the next player i.e O and expects the 2nd user to click on the screen anad this cycle is repeated until a winner is declared or we reach a stalemate.
Time Traveling is now possible!
Accidentally clicked on th wrong box? Dont worry! Under the boxes you will find an ordered list of buttons that expands as you progress through the game, just click on the "Go to move #n" button to go back and play the nth move or click on "Go to game start" button to restart the game.
Note - As of now the list of buttons doesnt disappear when you restart or track back through multiple moves but I am working on it
I hope you enjoy it and feel free to leave any feedback. Thanks for playing!
~ Samiran