React hooks... Oops! Part 1 - Introduction
Familiarity makes us feel safe and confident. Yet, what's just familiar isn't exactly equal.
I believe that's the very reason why it's both so tempting and dangerous to start relying on a new tool, regardless how familiar does it seem to be, without first understanding what makes it different from what we already know.
React hooks are one of these new, shiny tools. Not only they are hip, but also some of them look pretty familiar and easy to use, like the useState hook.
But there's a catch to it - they are more of low-level building blocks that enable us to construct our own abstractions than something designed to directly solve everyday problems.
They are intended to be a way for the community to build and share cohesive fragments of logic, not a drop-in replacement for effectful methods in classes.
Of course that doesn't mean that the built-in hooks cannot be useful on their own. If using a handful of them actually solves the problem, that's great! But if I learned anything important about hooks, it's that as soon as I get plenty of them in a single component, I should stop and think whether that's the way to go.
More often than not, multiple interconnected hooks are a sign that there's an abstraction waiting to be extracted. Sometimes it may be possible to use an off-the-shelf hook, and other times, we may need to extract one ourselves.
You known what they say about mistakes. We can learn from them. And I must admit that I learned plenty of lessons that way. In this series, I'm going to tell you about mistakes made when building custom hooks, so that you can avoid them.
The next post from this serise: React hooks... Oops! Part 2 - why does my effect run multiple times with the same dependencies?
