Use Hooks – A Collection of Reusable React Hooks
use-hooks.org
Use Hooks – A Collection of Reusable React Hooks
1–10 of 34 posts
Re: Use Hooks – A Collection of Reusable React Hooks
#2I’m having a hard time understanding what problems this (and hooks in general) really solve. Why should I use the axios hooks over just using axios directly?
Re: Use Hooks – A Collection of Reusable React Hooks
#3I’m having a hard time understanding what problems this (and hooks in general) really solve. Why should I use the axios hooks over just using axios directly?
Many front-end developers keep building the same thing over and over again with minor variations. To make the work feel more meaningful, it’s regularly reprojected onto a new pattern. Then you can go give a conference talk about “I did old thing X using new thing Y” and get away from the office for a day.
Re: Use Hooks – A Collection of Reusable React Hooks
#4I’m having a hard time understanding what problems this (and hooks in general) really solve. Why should I use the axios hooks over just using axios directly?
Reusability, which software folks generally consider to be a good thing.
Let's say you used Axios directly in your components. That means every component needs to (1) set up its own state to track the request status (like whether it's loading, errored, the latest payload, etc.) and (2) set up its lifecycle hooks to kick off the request at the appropriate times, update the component's state, etc.
Do this a few times and you'll notice things becoming very repetitive. So naturally you look for a way to factor that out.
A higher-order component (basically a function that generates a component with all that boilerplate) is one option. Another option is what you see here – Hooks.
Re: Use Hooks – A Collection of Reusable React Hooks
#5I’m having a hard time understanding what problems this (and hooks in general) really solve. Why should I use the axios hooks over just using axios directly?
The problem isn't using axios, it's making sure your React components interact with axios appropriately. You will want the request to (1) fire when the component mounts, (2) cancel if it's going to unmount, and (3) re-render with the result/error once the request is finished. This is a pattern you will do over and over again. This gets really messy when one component needs to be able to make two or three different calls. The usual approach is to wrap that component with two or three different "container" components that each handle a different call. That keeps the view simple, but now the problem is insanely deep nesting of components.
Part of the goal with hooks is to give a way to abstract away the details of how you must interact with the React, without resorting to burying your view-components under 10 layers of controller-components.
Re: Use Hooks – A Collection of Reusable React Hooks
#6I’m having a hard time understanding what problems this (and hooks in general) really solve. Why should I use the axios hooks over just using axios directly?
If you haven't yet, I'd encourage you to seriously read through the hooks docs [0], as well as Dan Abramov's recent post discussing why they settled on this API design [1].
Re: Use Hooks – A Collection of Reusable React Hooks
#7Hooks are interesting. We are reading about it and evaluating it.
However, I have a hard time in understanding why I should use all these tiny ‘use’ libraries? Hooks are already simple to implement such small snippets yourself in your codebase.
Re: Use Hooks – A Collection of Reusable React Hooks
#8I’m having a hard time understanding what problems this (and hooks in general) really solve. Why should I use the axios hooks over just using axios directly?
Many front-end developers keep building the same thing over and over again with minor variations. To make the work feel more meaningful, it’s regularly reprojected onto a new pattern. Then you can go give a conference talk about “I did old thing X using new thing Y” and get away from the office for a day.
Yawn.
Re: Use Hooks – A Collection of Reusable React Hooks
#9Hooks are interesting. We are reading about it and evaluating it. However, I have a hard time in understanding why I should use all these tiny ‘use’ libraries? Hooks are already simple to implement such small snippets yourself in your codebase.
Because it's reusable, you can apply it in more projects than one.
In another way, if a Hooks includes business logic, then it should be put in your project.
Re: Use Hooks – A Collection of Reusable React Hooks
#10I’m having a hard time understanding what problems this (and hooks in general) really solve. Why should I use the axios hooks over just using axios directly?
The problem isn't using axios, it's making sure your React components interact with axios appropriately. You will want the request to (1) fire when the component mounts, (2) cancel if it's going to unmount, and (3) re-render with the result/error once the request is finished. This is a pattern you will do over and over again. This gets really messy when one component needs to be able to make two or three different ca…
Ah interesting and makes a lot of sense. I’m used to using redux with some other middleware to solve this problem and honestly I’ve never been happy with it. Thanks for the response!