React For Beginners Build A Game While Learning React. Js

0

1

2

3

4

5

Posted on 28 Nov 14:05 | by mitsumi | 24 views

2022-11-28
MP4 | Video: h264, 1920x1080 | Audio: AAC, 44.1 KHz
Language: English | Size: 198.31 MB | Duration: 48m

React For Beginners Build A Game While Learning React. Js

About This Class
For the class project, make the game your own! Can you improve the design of the game? You can start easy, change the layout a bit, add a welcome screen or create different markers with SVG.
Description
React is currently the most popular front-end library. It's easy to begin with yet it's very capable even for building large-scale professional web-applications. In this course, we learn the fundamentals of React while having some fun and creating a Tic Tac Toe game.
While building a game we dive into the fundamentals of React like
How to break down your application or game into smaller pieces, into components?
How to structure your logic and how to connect these components with props and callbacks?
How to deal with change, what is the state, what to store in it, and where to define it?
How to add interaction and how does re-rendering work in React?
And while it has nothing to do with React we are also going to draw some basic images by coding SVGs.
This is an introductory course for beginners. We don't get to more advanced things like routing or state management of large-scale applications. Instead, I give you a foundation you can build on.
Requirements
This is an intro course, no prior React knowledge is required, but some HTML, CSS, and basic jаvascript skills are necessary.
Project Guide
For the class project, make the game your own! Can you improve the design of the game? You can start easy, change the layout a bit, add a welcome screen or create different markers with SVG.
If you want to take this game to the next level you can turn it into a Gomoku game. In Gomoku, the grid is not just 3x3 but much bigger, and you need to have five tokens in a row in order to win the game. While essentially having the same logic, Gomoku is a much more challenging and fun game due to the bigger grid.
You don't have to stop there. You can create an entirely different game with a similar logic like Minesweeper. Here you don't have to bother with computer logic and players taking turns, but you need to generate levels and handle the logic of hiding each tile at first.
Whatever you come up with, please share your result to let the world know how awesome games you can create with React. Game on!
Overview
Lesson 1:Introduction
Lesson 2:Breaking down the game into components
Lesson 3:Creating our first components
Lesson 4:The Grid
Lesson 5:Which square is which?
Lesson 6:The changing parts
Lesson 7:Our first attempt to have a state
Lesson 8:Lifecycle of a component
Lesson 9:Circles and Crosses
Lesson 10:Interaction
Lesson 11:The winner is...
Lesson 12:Detecting the winner
Lesson 13:Conclusion