What you'll learn
In this project we will use several different methods of managing the state within a mostly built application. We will cover state management within class-based components as well as functional components. We will also cover the context API, as well as hooks
Table of contents
Setup
15m
- Set up your local environment for this project. We'll walk you through everything you need to know to set up your local instance, and to access the code you'll be using for this project.
Hydrate the state
20m
- In this module we will hydrate the state of the game.
Handling click events
25m
- In this module we will create the handleTileClicked event handler, as well as finish wiring up the basics of the game.
Creating a custom Hook
45m
- In this module we will build a custom hook that uses the useRef, useState, and useHover hooks.
Refactor the App to use the Context API
15m
- In this module we will refactor part of the app to use the Context API. Do note that the size of this app doesn't necessarily lend itself well to using Context. We could more easily fix the issue of passing props through too many components by fixing the Apps composition. For more on this subject see the react docs: https://reactjs.org/docs/context.html#before-you-use-context
About the author
Auggie is a Full Stack Software Engineer at Pluralsight. He was lucky enough to be gifted a Compaq Portable III when he was 10 years old, and immediately started learning how to program games in Q-Basic. Throughout his teenage years he picked up HTML, CSS, and a bit of Javascript. Developing websites for the bands he played guitar in and friends bands into his twenties, led him to his passion and ultimately seeking a career in web development.
