Tic Tac Toe
One of the first games we learn to play! Enter HTML, CSS and Javascript; and its not that much fun any more! Enough to drive you crazy when you actually try to code and style it!!
![This is how I started] (https://github.com/natyv/ticTacToe/blob/master/scratch%20book/20160401_113141.jpg) ![then this] (https://github.com/natyv/ticTacToe/blob/master/scratch%20book/20160401_113153.jpg)
The app
- Renders a game board in the browser
- Switch turns between X and O (or whichever markers you select)
- Visually displays which side has won
- Allows customization of Player names and Player tokens
- Is responsive
- Saves the game and game info of an incomplete game, even when the browser is closed and reopened
Baby Steps
- I started off implementing a basic game which let 2 players play alternately and outputs the winner or a tie situation. The input events are stored in variables and then compared with all the winning combinations to determine the winner.
- Added Reset function.
- The next step was adding some CSS styling.
- The next step was allowing the Players to customize the tokens.
- Added game counters to keep score over multiple games.
- Used local storage to store and retrieve game info when browser is closed or internet connectivity is lost mid-game.
The game does not have AI functionality, doesn't play against the computer. The biggest challenge was that I kept checking the online game page instead of my local working page and then wondering why it didn't reflect any of the changes I had made! And ofcourse, CSS is always a challenge!
The links for the repo and game are below:
Github repo: https://github.com/natyv/ticTacToe
Hosted version: http://natyv.github.io/ticTacToe/
Enjoy!