Custom Hooks - React In Depth

Опубликовано: 03 Сентябрь 2023
на канале: Tech with Nader
1,088
61

Let's learn about Custom Hooks in React together.

We start with an overview of what a custom hook is and why we would use one and look at them in the context of the React Component Lifecycle.

Then, we look at an example of a custom hook that uses a single useEffect to log a message when a component mounts and how we can re-use it.

We then create a more complex hook by also brining in useState along with useEffect to create a useTimer hook that we can re-use across components. We also see how each component gets its own independent state and lifecycle.

To wrap up the video we recap the main ideas behind custom hooks, where and why to use them and some places we might see them in the wild.

Chapters:
00:00 Introduction
01:14 Custom Hooks Overview
03:01 React Component Lifecycle
04:07 useEffect Custom Hooks Example
09:33 logOnMount Hook Code Example
15:57 Starting Hooks with "use"
17:51 useTimer Custom Hook Example
20:55 useTimer Custom Hook Code
28:18 Custom Hook Visualization
29:47 Independent States Across Hooks
33:10 Recap
35:13 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  


Смотрите видео Custom Hooks - React In Depth онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Tech with Nader 03 Сентябрь 2023, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 1,08 раз и оно понравилось 6 людям.