React - The Complete Guide

Section 15: Building Custom Hooks - Re-using Logic

olivia_yj 2022. 12. 1. 06:12

The goals

💪🏻What & Why?

✌🏻Building a Custom Hook

👍🏻Custom Hook Rules & Practices

 

Make our own React Hook in Hooks folder and we can use it as Hook anywhere!

The most important thing is naming. It should start with 'use' and its purpose is to make component slimmer.

Since we are getting 'forward' as parameter in function, we should set it as a denpendency in useEffect.

With this way, we can refactor our code and organize clearly!

 

So we can make the hook which returns the values we need in different components and just can simply import and use it!

When we return if the name of the value we wanna return and the value's name are the same, then we can simplify it like below!