Overview
Build a dog guessing game using React and data fetching with useEffect in this comprehensive tutorial video. Learn how to set up a project, fetch data from a Dog API, implement useEffect for data fetching, prepare data for questions, manage state with Immer Reducer, create game questions, design the game interface using JSX, implement game logic, add a time clock and hearts UI, create a game over screen, implement a countdown timer, preload images, and store high scores using local storage. Follow along step-by-step to create a fully functional React-based game while mastering key concepts such as API integration, state management, and user interface design.
Syllabus
Intro.
Starter Setup.
Fetching Dog API Data.
useEffect Data Fetching / Strict Mode.
Getting Data Ready for Questions.
State with Immer Reducer.
Creating Questions.
The JSX Game Interface.
Game Logic.
Time Clock & Hearts UI.
Game Over Screen.
Actually Counting Down Time.
Preload Images.
High Score Local Storage.
Taught by
LearnWebCode