Exercises: Custom Hooks - React In Depth

Published: 04 September 2023
on channel: Tech with Nader
1,165
52

Let's go through some exercises to practice Custom Hooks in React together.

We start with a warmup to create a hook that will log when a component mounts and re-renders in a re-usable way.

In the first main exercise we see what a custom hook would look like that checks to see if a user might be authenticated in an application and how that might be shared with other components in the component hierarchy.

For the second exercise, we create a hook that wraps around useState that logs the previous and next state values as state changes.

To wrap up the video, we look at how we can create our own data fetching hook that implements caching inside it.

Chapters:
00:00 Introduction
00:35 Warmup Exercise - Rerender Logger
11:06 Exercise 1 - useAuth Hook
22:12 Exercise 2 - useState with Logging
38:39 Exercise 3 - useQuery Data Fetching
1:13:51 Next Steps

📦 Github Repository with the notes and exercise code+solutions: https://github.com/Nooder/react-in-depth

💬 Come join us on Discord to chat with a like-minded community about tech and learning:   / discord  

🏅Support the channel and content through Super Thanks, Channel Memberships, or on Patreon:   / techwithnader  


Watch video Exercises: Custom Hooks - React In Depth online without registration, duration hours minute second in high quality. This video was added by user Tech with Nader 04 September 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 1,16 once and liked it 5 people.