Learn React Custom Hooks With Real-World Examples

Hello, my friends and fellow developers!

In this video, we cover how you can create and use custom hooks in React!

Let me know in the comments below if you want more React content or something else.

Relevant tutorials:

Websites mentioned in video:

Timestamps:
00:00 - Introduction
00:32 - Feature overview
00:45 - Why custom hooks?
01:26 - Creating the custom hook
02:49 - Logic inside the custom hook
07:12 - Advanced and real-world example
08:52 - The custom useFetch hook
10:58 - Using the useFetch hook
13:46 - Custom hooks websites and libraries
14:56 - Conclusion

Other Tutorials:

Connect 🔗 :

VS Code Theme used: Default Dark Modern

Suggest, ask doubts in the comments and share these videos to help!
Thanks for Watching!

#reactjs #javascript #typescript

[PerryCodes]

With this one video I was able to easily understand what Custom Hooks are. This was really well done. Thank you!

[tonyg_nerd]

First time seeing you. We'll done. This vid is clear, concise, professional, and informative. You edited to respect our time, and provided links. All of this is greatly appreciated! Best to ya.

[EventLoopHero]

It'll be interesting to hear how to properly decompose component code. Let's say we have a user page that uses a lot of reusable components requiring state management, such as handleClick, toggle, swithes, selects, check functions, etc. Additionally, we need to fetch data for the page.

Should we create multiple separate custom hooks (e.g., useCustomHooks) for each piece of logic? This approach might feel unnecessary for some cases and, instead of simplifying the component, it could result in excessive custom hook usage.

Or, should we create a single useUsers custom hook that handles both data fetching and state management within one hook? However, this would mean we don't use a more generic useFetch anymore.

Alternatively, is it okay to use custom hooks inside other custom hooks, or does this potentially violate React's rules of hooks?