2023 年通过构建 Hangman 游戏来学习 React JS
Learn React JS by Building a Hangman Game in 2023
- 1. Introduction
- 1. Intro to the course
- 2. Who is this course for and what to expect
- 2. Getting Started with React JS
- 1. Installing React JS on your computer
- 2. First look inside a React JS application
- 3. The JSX file extension
- 4. Installing TailwindCSS in your React JS project
- 5. Overview of styling React JS applications
- 3. Building the Hangman game
- 1. Quick overview of the application
- 2. Building our first React component
- 3. Class-based components vs Functional components
- 4. Styling the Layout and the Header component
- 5. Rendering using arrays in React JS
- 6. Styling the Footer Component
- 7. Using Props with Components
- 8. Creating the Hangman Component (Part 1)
- 9. Creating the Hangman Component (Part 2)
- 10. Creating the Letters Component
- 11. Creating the Keyboard Component
- 12. Adding interactivity to our Keyboard buttons
- 13. Using the useState hook with our Components
- 14. Adding some more buttons to the application
- 15. Creating the AlertBox Component
- 4. Implementing logic to the React JS application
- 1. Using useReducer to manage the state of the Application
- 2. Creating the function to generate words for the Game
- 3. Conditionally rendering the Components
- 4. Looking into the Reducer function
- 5. Adding an action to the Reducer function
- 6. Fixing the re-render error with useEffect hook
- 7. Adding the logic to make a guess (Part 1)
- 8. Adding the logic to make a guess (Part 2)
- 9. Adding the logic to win the game
- 10. Making the Give Up button work
- 11. Making the Hint button work