Original subtitles

So, what are custom hooks?

And we need to clarify what they are

before I can dive into the why.

So, what are custom hooks?

Custom hooks are, in the end, just regular functions

just as the built-in hooks, like use state, are

in the end just functions, but they are functions

which can contain stateful logic.

You can build custom hooks, these custom hook functions

to outsource stateful logic into reusable functions.

Unlike regular functions, custom hooks can use

other React hooks, including other custom hooks.

And they can, therefore, also leverage React state managed

with use state or use reducer.

They can access use effect and so on.

With custom hooks, you can outsource logic,

which you might be using in different components,

into a custom hook, which you can then call

from all these various components.

So, it is simply a mechanism of reusing logic,

just as regular functions are with the special thing

that in these custom hook functions,

you can use React hooks and other hooks.

And that might, of course, still be a bit abstract.

So, therefore, let me give you

a concrete example which shows you

why you might wanna explore custom hooks

and how you then build a custom hook,

step-by-step and how you use it.