Create your own hooks in ReactJS

By
October 21, 2022  · < 1 min read

Most of us(ReactJS developers) are aware of built-in hooks like useState, useEffect, useRef, useMemo, useCallback, etc. Some of us know the concept of custom hooks but have never used them.

So here, I will be explaining the use case and the advantages of using a custom hook.

The custom hook is a function with the power of reactjs features like useState, useEffect, etc.

Why custom hook

  • It has a separate logic from the user interface component.
  • It’s reusable
  • useState, useEffect and other react hooks can be used within it

Let’s directly dive into the code:
Here, I will be creating an axios custom hook:
useAxios.js (Custom hook)

Home.js (This component is using utilizing useAxios)

The code is quite self-explanatory. I hope you understand about creating the custom hook. Let me know your thoughts in the comment.

Thanks 🙂

This post was written by Surjeet, Hiren C & Lokesh of the SixBerries Team.