Challenges
Roadmaps
Playground
Feedback
Mark as complete
Share Solution
Description
Submissions
#399
Tic Tac Toe
medium
react
Implement a React component for a classic
3×3 Tic Tac Toe
game.
Requirements
Render a
3×3 grid
of clickable squares.
Two players take turns:
“X”
goes first, then
“O”
.
A move places the current player’s mark in an
empty
square only.
Detect and display
winner
(3 in a row/column/diagonal) or
draw
when the board is full.
Disable further moves
after a win or draw.
Provide a
Reset
button to start a new game.
Use React hooks (
useState
,
useEffect
) to manage state.
Bonus
Show a
turn indicator
(“X’s turn” / “O’s turn”).
Add a
scoreboard
that persists within the session (wins for X, O, and draws).
Implement
time travel
: a move history you can step through to view/restore previous board states.
/styles.css
/App.jsx
/index.jsx
Preview
Console