Create a Chess game with Reactjs part 27: Cloning
Deep cloning objects and implementing it in combination with the React useState hook is what we are going to talk about and implement in this episode of creating a chess game with React using TypeScript.
The code in this video can be found on the Frontend Coding GitHub repository:
https://github.com/FrontendCodingYT/c...
Timestamps:
0:00 Welcome! Short introduction.
0:20 Coding! Creating the Chessboard class.
5:20 Coding! Moving code from the Referee.tsx to the Board.
17:15 Demo! Does it still work?
18:35 Coding! Adding the moves to the Board.
21:57 Demo! Can the knight beat the pawn?
24:14 Demo! Second attempt.
25:04 Explaining! Why is the UI not updated
27:15 Demo! Third attempt.
27:34 Explaining! How to update object with setState?
29:47 Coding! Implementing clone function.
45:42 Demo! Fourth attempt :).
46:05 Coding! Snapping pieces back after invalid move.
47:30 Coding! Fixing the double piece effect.
59:50: Demo! Fifth attempt, almost!
1:0044 Demo! Succes!
1:02:05 Coding! Enhancing the Pawn class.
1:04:39 Coding! Small bugfix first pawn turn.
1:05:39 Thank you for watching! See you next time :)