在ReactJS中实现策划棋盘游戏视频教程

代码在说话——用编码改变世界，我们将在ReactJS中实现一个策划棋盘游戏。你将学到什么:在你的MAC电脑上创建一个react项目启动一个react项目创建一个react组件用CSS和flexUse设计风格使用React挂钩，如useState()和useRef()Drag & amp；放入react中显示网页的用户交互区域react中的用户交互，如鼠标点击、鼠标移动、鼠标悬停和拖放在react中实现棋盘游戏逻辑在设计用户界面时考虑网格，Implement the Mastermind Board Game in ReactJS

在第一部分介绍中，我们将讨论技术设置，如何访问代码，项目结构，棋盘游戏，游戏规则和一些用户界面方面。在第二部分中，我们进行编码，它被分成编码块。每个编码块专注于代码库的某个方面。编码块需要以给定的顺序执行。在编码模块的最后，我们将讨论代码改进建议，以及如何通过添加新功能来扩展游戏的想法，例如游戏的多人版本。我们还讨论了反馈选项

由Marcus Stephan创作
MP4 |视频:h264，1280×720 |音频:AAC，44.1 KHz，2声道
类型:电子教学|语言:英语|时长:14节课(2小时2分钟)|大小:1.28 GB

你会学到什么
在MAC电脑上创建react项目
启动react项目
创建一个反应组件
使用CSS和flex进行样式设计
使用像useState()和useRef()这样的React挂钩
在反应堆中拖放
隐藏和显示网页的区域
react中的用户交互，如鼠标点击、鼠标移动、鼠标悬停和拖放
在react中实现一个棋盘游戏逻辑
当你设计你的用户界面时，考虑网格

要求
一些javascript会有所帮助。
本课程需要一台MAC电脑。

Code Is Talking — Change the World with Coding

What you’ll learn
Create a react project on your MAC Computer
Start a react project
Create a react component
Styling with CSS and flex
Use React Hooks like useState() and useRef()
Drag & Drop in ReactJS
Hide and Show areas of the web page
User interaction in react like mouse click, mouse move, mouse hover and drag and drop
Implement a board game logic in react
Think in grids when you design your UI

Requirements
Some javascript would be helpful.
You need a MAC computer for this course.

Description
We will implement a Mastermind Board Game in ReactJS.What you will learn:Create a react project on your MAC ComputerStart a react projectCreate a react componentStyling with CSS and flexUse React Hooks like useState() and useRef()Drag & Drop in ReactJSHide and Show areas of the web pageUser interaction in react like mouse click, mouse move, mouse hover and drag and dropImplement a board game logic in reactThink in grids when you design your UIYou will have access to the entire code at the end of the class and can use it for whatever you want.In the first part the introduction we will talk about the tech setup, how to access the code, the project structure, the board game, the game rules and some UI aspects.In the second part we do the coding, it is divided in coding blocks. Each coding block is focusing on a certain aspect of the code base. The coding blocks needs to be executed in the given order.At the end of the coding blocks we will discuss code improvement suggestions, and ideas how the game could be extend by adding new features, for example multiple player version of the game. We also talk about options for feedback