Re:React best practices
by zarathustreal on Monday May 03, 2021 @06:05PM
(#27031400)
Absolutely.. it doesn't make sense to pick a tool like React (a DOM rendering library) to solve the problem of HTTP request state management, that's just not what "component" means in the React sense.
[ Parent
| on HN ]
well the problem is, that most of the time you want:
1. show that you start a http call, by showing a loading spinner and blocking a button
2. do the http call
3. show the result to the user (even errors)
4. unblock the button and hide the spinner
thus most often http requests are somehow required to be dependant on your ui. libraries like redux-saga help with that.
Re:React best practices
by bluedevil2k on Tuesday May 04, 2021 @09:46AM
(#27037512)
try {
setLoading(true);
const responseData = await api.some.apiCall();
updateUI(responseData);
}
catch (err) {
showUIError();
}
finally {
setLoading(false);
}
that was the easy part. now what do you do if two independent parts of the ui need to do something if the responseData gets updated. you either bubble downards or you need a store.
Re:React best practices
by bluedevil2k on Thursday May 06, 2021 @08:01AM
(#27061949)
Yes, you'd probably use Redux and wrap that API call in a dispatch(). I try to stick to the design pattern of "get a response from the API call if you need the data in that function, otherwise use Redux". I've created a library that really helps with this if you're interested - https://github.com/bluedevil2k/ruffle