- Fork and clone the TicTacToe-101 Repo
- Use Live-Server to open this folder in the browser.
- Open your Chrome inspector tool and select the Console tab.
- Deselect the "Select an element in the page to inspect" tool - so you don't have highlights chasing your cursor.
- Click on the top-left box...what happens in the console.
- Notice the notes on the far right:
scripts.js: 20
,scripts.js: 43
, andscripts.js: 44
. These tell you what line of code this log was generated. - Go find the lines these logs came from in the
scripts.js
file. - Go to the
index.html
file and find line 22:<td id='top-left' onclick="handleClick(this)" ></td>
- The
onclick
method calls thehandleClick()
function in thescripts.js
file and passes itself, the<td>
element to it. - Don't move on until you understand how that works.
- The
- Now read each of the green comment lines to start piecing together how this app works.
- After you have a general understanding find the
// @TODO
comments and fix the problems described. - Go to the HTML file and create all the rows you need for a complete Tic Tac Toe board.
- When you've finished create a Pull Request(PR) on the original repo and turn in the URL of that PR.
<iframe src="https://player.vimeo.com/video/395004475" width="640" height="480" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe>