I never was exposed to those rarely used life cycle methods
shouldComponentUpdate - for possible optimization
getDerivedStateFromProps - for computed states
getSnapshotBeforeUpdate - saving state to use it after render
but now I understand where I need to use them 😎.
What was surprising 😲 was componentDidCatch. I thought I had to create a separate component (<ErrorBoundary/> to be able to use it but it seems like there is no need for it.
Tips for others
I was able to get more out of Nick's video while reading the official React documentation & watching the video at the same time.
You're welcome, Sung. I'm glad that this was useful. I hope the quality of the recording was better this time. :)
(I responded yesterday, but I'm not sure what happened to my post!)
Although I used componentDidCatch in my class, I think creating an ErrorBoundary component might be a better approach as it is reusable and you don't have to track the error state, etc. and perform conditional rendering. It also depends on the complexity of your app. I took a few shortcuts in this tutorial to keep it relatively short (but it was still 25 minutes!).
Thanks for the tip about following the official React documentation. That is a good idea.
Thank you for the tutorial, Nick 🙏.
I never was exposed to those
rarely used
life cycle methodsshouldComponentUpdate
- for possible optimizationgetDerivedStateFromProps
- for computed statesgetSnapshotBeforeUpdate
- saving state to use it after renderbut now I understand where I need to use them 😎.
What was surprising 😲 was
componentDidCatch
. I thought I had to create a separate component (<ErrorBoundary/>
to be able to use it but it seems like there is no need for it.Tips for others
I was able to get more out of Nick's video while reading the official React documentation & watching the video at the same time.
You're welcome, Sung. I'm glad that this was useful. I hope the quality of the recording was better this time. :)
(I responded yesterday, but I'm not sure what happened to my post!)
Although I used componentDidCatch in my class, I think creating an ErrorBoundary component might be a better approach as it is reusable and you don't have to track the error state, etc. and perform conditional rendering. It also depends on the complexity of your app. I took a few shortcuts in this tutorial to keep it relatively short (but it was still 25 minutes!).
Thanks for the tip about following the official React documentation. That is a good idea.
Yes it indeed was better 😃