React hooks are absolutely awesome, they make abstracting away common utilities so incredibly simple!
I recently needed to use Firebase in an app (https://webframe.xyz), and my default instinct was to Google “Firebase React module” to find some kind of Firebase helper that would work with React. I did find one, but it seemed a bit complicated to setup and then I had a thought…
What if I could use that new React Hooks thing? It’s both new and cool, so obviously that’s the way to go 😂.
So, here is my finished hook (easy, reusable):
For comparison, here’s an equivalent class approach (harder, not reusable):
The biggest advantage with hooks, is that you can re-use it in all of your components (and it works with function components too) — whereas the class approach needs to be manually copied across each time!
Hope that helps! 👍🏽
If you enjoyed this article please tap that green hand 🙏.
And check out 1productaweek.com, to find out why we’re building one product a week.