Read 32 ~ Custom Hooks
By Abdallah obaid
NAME | URL |
---|---|
Home | Home. |
Prep | Prep: Engineering Topics. |
Read 01 | Node Ecosystem, TDD, CI/CD. |
Read 02 | Classes, Inheritance, Functional. |
Read 03 | Data Modeling & NoSQL Databases. |
Read 04 | Advanced Mongo/Mongoose. |
Read 05 | Linked Lists. |
Read 06 | HTTP and REST. |
Read 07 | Express. |
Read 08 | Express Routing & Connected API. |
Read 09 | API Server. |
Read 10 | Stacks and Queues. |
Read 11 | Authentication. |
Read 12 | OAuth. |
Read 13 | Bearer Authorization. |
Read 14 | Access Control (ACL). |
Read 15 | Trees. |
Read 16 | Event Driven Applications. |
Read 17 | TCP Servers. |
Read 18 | Socket.io. |
Read 19 | Message Queues. |
Read 26 | Component Based UI. |
Read 27 | React Testing and Deployment. |
Read 28 | Props and State. |
Read 29 | Component Composition. |
Read 30 | Hash Tables. |
Read 31 | Hooks API. |
Read 32 | Custom Hooks. |
Hooks API
## Hooks:
- Hooks are functions that let you “hook into” React state and lifecycle features from function components.
- Hooks don’t work inside classes.
- React Hooks are functions that let us hook into the React state and lifecycle features from function components.
useState()
Returns a stateVariable and setterFunction for you to use to manage state in a functional component.
## Custom Hooks:
- Custom hooks allow you to create functionality that can be reused across different components.
- Its name should always start with use
- Extract duplicated logic from components, share common functionality, But not state and take advantage of useEffect lifecycle.
- Custom Hook doesn’t need to have a specific signature unlike a React component. We can decide what it takes as arguments, and what, if anything, it should return.
- Hooks do not render.
## Common use cases – make things DRY:
- Handle forms easily.
- Pre-fetch API data.
- Connect to services (like socket.io, Q, etc).