- Solidify and demonstrate your understanding of:
- DRY JavaScript
- event delegation to handle similar event listeners
- Understand the difference between the data model and how the data is displayed on the DOM
- Iterate through/filter DOM elements using for loops
- Use your problem solving process to break down large problems, solve things step by step, and trust yourself to not rely on an outside “answer” to a logical challenge
This web app allows you to play a game of tic-tac-toe. The banner displays which player's turn it is, who won the game, and if the game is a draw. The side columns keep track of the amount of wins each player has and stores them locally so they stay on page refresh. There is also a sound effect for when a token is placed and hover states so the user knows when and where they can place a token.
- Fork the repository found here
- Clone down your new, forked repo. While cloning, name it what you want your project to be named, and run
git clone
. - cd into the repository
- Run
open index.html
in your text editor
Alternatively:
This was the final project for Mod1 2210FE students. The start date was November 8th and it personally took until the 11th to complete.
Some wins included:
- Keeping all Data model and DOM functions seperate from one another.
- Learning and adding local storage and audio functionality.
Some challenges included:
- Checking whether a space was available using the data model first then updating the DOM.
- Refactoring to un-nest functions from within each other so future iterations could be added easier.