Create a Chess Game with ReactJS - Part 21: Pawn Promotion

Опубликовано: 17 Март 2026
на канале: Frontend Coding
2,617
49

In this part of creating a chess game with ReactJS using TypeScript we add pawn promotion. We start by creating the logic for checking when a pawn reaches the promotion row.

The code in this video can be found on the Frontend Coding GitHub repository:
https://github.com/FrontendCodingYT/c...

Timestamps:
0:00 Welcome! Demo of what we are going to create.
0:45 Explaining! What is pawn promotion?
1:50 Coding! Check if pawn is up for promotion.
8:00 Coding! Creating the promotion modal.
11:10 Challenge! Filling the modal with options.
15:10 Coding! Clicking on a promotion.
16:27 Challenge! Promoting a pawn.
20:03 Challenge! Prevent background clicks with modal.
23:30 Coding! Hiding the modal.
26:45 Coding! Promotion logic.
34:35 Challenge! Promoting only pawns.
35:30 Coding! Promoting both sides.
38:20 Thanks for watching! See you next time :)