-
Notifications
You must be signed in to change notification settings - Fork 0
Tic tac react #17
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: gh-pages
Are you sure you want to change the base?
Tic tac react #17
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Overall #solidwork, but at least translate facebook's tutorial into what we've learned. And maybe make a reset function!
Edit: Copy-pasting a tutorial does not constitute your work.
| } | ||
| renderSquare(i) { | ||
| return ( | ||
| <Square |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Very nice use of a render function, but remember to code DRY (don't repeat yourself).
I'd recommend instead making this a renderSquares() function that maps through this.state.squares. This way you have access to the index of each square which you can pass into this.state.squares[index] as well as this.handleClick(index).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also you've got some funky indentation here. coughCOPYPASTINGFROMTHEREACTDOCScough
| } | ||
|
|
||
| handleClick(i){ | ||
|
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Unnecessary whitespace
| <div data-cell="0"></div> | ||
| <div data-cell="1"></div> | ||
| <div data-cell="2"></div> | ||
| {/*<div data-cell="0"></div>*/} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Get rid of all these
| {/*<div data-cell="8"></div>*/} | ||
| {this.renderSquare(8)} | ||
| </div> | ||
|
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Unnecessary whitespace
|
|
||
| ReactDOM.render(<TicTacToe />, document.getElementById('tic-tac-toe')); | ||
|
|
||
| function calculateWin(squares){ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is that the word function?
| [0, 4, 8], | ||
| [6, 4, 2], | ||
| ]; | ||
| for(let i = 0; i <lines.length; i ++) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is this a for loop? Why?
Checkpoint Rubric
This is the rubric that your instructor will use to grade your checkpoints. Please do not edit.
Checkpoint 1
Checkpoint 2
Checkpoint 3