React Tutorial #9: Custom Hooks

Published: 27 July 2023
on channel: Code Emily
474
18

Welcome back to Code Emily! Stuck on React JS Custom Hooks?! Why use a React Custom Hook? How do you create a React Custom Hook? Learn those two things and more in this video! All while using the Pokemon API, useEffect, useState and the JS Array method, map, to map out our data.

Whether you're a beginner or an experienced developer, this React JS tutorial on custom hooks will walk you through the process of building reusable hooks that optimize code reusability and maintainability.

Links mentioned

React Array Destructuring Video:    • JavaScript Destructuring & The Rest O...  

Other Important Links

If you're stuck on the ins & outs of the useEffect hook:
   • React JS Tutorial #7: the useEffect Hook  

If you're stuck on the ins & outs of the useState hook:
   • React JS Tutorial #6: the useState Hook  

Full React JS Beginner Tutorial:    • React JS Full Tutorial  

If you're new to JavaScript as well, don't worry! Code Emily has got you covered with a comprehensive JavaScript tutorial series.

Full JavaScript Tutorial:    • JavaScript Tutorials  

00:00 Intro: Custom Hooks Definition, why they need to start with "use"
00:20 Let's create a custom hook! Intro to the example we're going to use (using the Pokemon API)
01:21 Moving logic from the component to a custom hook
02:30 Importing the custom hook into our component
03:05 Adding a loading state to our custom hook
03:51 Returning multiple variables from our custom hook
04:15 Importing multiple variables from our custom hook and using the loading state in our component
05:20 Discussing the Pokemon React Component
05:40 Refactoring our pokemon data mapping into using the Pokemon React component
05:40 Refactoring our pokemon data mapping into using the Pokemon React component
06:50 Overview on Refactoring the Pokemon Component to use our Custom Hook
07:01 Refactoring the Custom Hook to use a variable called url
06:50 Refactoring the Pokemon Component to use our
Custom Hook
08:30 Benefits of using Custom Hooks: Why use them?
08:57 Outro & Thank you!


Watch video React Tutorial #9: Custom Hooks online without registration, duration hours minute second in high quality. This video was added by user Code Emily 27 July 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 474 once and liked it 18 people.