filmov
tv
Create a Chess Game with ReactJS - Part 1: The board!
Показать описание
Hello and welcome to the series on creating a chess game with ReactJS using TypeScript!
In this series we create a chess game from scratch using only ReactJS with TypeScript. Together we walk through the challenges that come with this and we come up with solutions that improve our game.
The programs used in this tutorial:
The chess pieces used in this tutorial can be found on the Frontend Coding GitHub repository:
You can set up the project using the following command:
npx create-react-app chess-app --template typescript
In this first part of the series we start by setting up the project using the command which you can see above here. Then we analyze the chess board and figure out how we are going to implement this.
Then we start coding the component for the chess board. After the chess board we create a tile component which we use inside of the chess board component.
To finish if off we implement a CSS grid for the chess board. We determine the number of columns and rows and which tiles are going to be black and white.
The code in this video can be found on the Frontend Coding GitHub repository:
Timestamps:
0:00 Introduction
0:20 Setting up the project
2:24 Analyzing the board
3:30 Creating the chess board component
8:54 Creating the tiles
16:27 Implementing the grid
In this series we create a chess game from scratch using only ReactJS with TypeScript. Together we walk through the challenges that come with this and we come up with solutions that improve our game.
The programs used in this tutorial:
The chess pieces used in this tutorial can be found on the Frontend Coding GitHub repository:
You can set up the project using the following command:
npx create-react-app chess-app --template typescript
In this first part of the series we start by setting up the project using the command which you can see above here. Then we analyze the chess board and figure out how we are going to implement this.
Then we start coding the component for the chess board. After the chess board we create a tile component which we use inside of the chess board component.
To finish if off we implement a CSS grid for the chess board. We determine the number of columns and rows and which tiles are going to be black and white.
The code in this video can be found on the Frontend Coding GitHub repository:
Timestamps:
0:00 Introduction
0:20 Setting up the project
2:24 Analyzing the board
3:30 Creating the chess board component
8:54 Creating the tiles
16:27 Implementing the grid
0:09:08
Turning a Log into a $1500 Chess Board…
0:29:22
Coding Adventure: Chess
1:28:06
♟️ Code CHESS in JavaScript (Super simple!)
0:11:20
I Made a BETTER Chess
5:37:17
Coding a Complete Chess Game AI With Python (Part 1) | PVP Game Mode
11:55:01
24 Hour Coding Livestream - Creating an Online Chess Game With Python
0:00:12
Names of Chess Pieces
0:00:41
IMPORTANT Chess Tip
0:21:42
My best chess game. Crazy sacrifices!
0:08:18
Creating a Chess Game with Python and Chat GPT: A Step-by-Step Guide
0:00:31
How To Win Chess in 2 Moves #Shorts
0:18:47
I built a $2000 chess board for $20
0:04:13
How to Play Chess
0:03:20
How to Set Up the Board | Chess
0:00:18
Win Chess in just 2 Moves Only! #Shorts
0:00:37
Lazard Gambit - Chess Opening Tricks & Traps #shorts
0:17:13
I Coded a Multiplayer Chess Game in React and Node.js
0:02:41
How to Set Up a Chess Board: Chess Rules Beginners | ChessKid
0:11:25
Chess Tips: How To Make a Plan
0:07:43
Why Championship Chess Sets Are So Expensive | So Expensive
0:00:32
Mate in 6 moves! Budapest Trap #shorts #chess
0:05:34
How to make chess board and pieces from cardboard | cardboard diy | DIY chess pieces
0:00:31
I beat a 2500 on chess.com 😳 #chess #chessgame
0:02:42
Custom Chess Positions Against Bots (easy tutorial)
Комментарии