Ambitious... Or Insane?
Problem solving.
It's a funny one.
Like, on the one hand, you're not supposed to give up. But then like there's this quote from someone (and it wasn't Einstein, by the way) that says that the definition of insanity is doing the same thing over and over again and expecting different results.
I guess there's a fine line.
And I crossed that line last night.
I guess you could say that I was insane.
I was creating a simple app using the React framework. Without paying a smidgen of attention to my browser, and most certainly not logging anything to the console, I plowed away at the keyboard, creating about six or seven components with some basic HTML and page navigation.
Finally, with great anticipation, I refreshed the browser and...
Nothing.
White. A mocking expanse of white.
Oh, and this error.
react.development.js:209 Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.
I then proceeded to spend the next several hours grappling with the error. (In less glorious terminology, traveling down the rabbit hole of insanity.)
The first option, mismatching versions of React and the renderer, went just right over my head.
It couldn't be the second option because I hadn't used any hooks yet. (In my merit, I checked the browser before writing out too much code. A fetch here and a fetch there, and I wouldn't have been able to rule that error out. )
Based on the way that I had set up my application, like I blind man in the darkness of the terminal, the last one just felt right to me. So using the webpage provided in the error, I proceeded to spend several hours trying to figure out how to solve the issue.
Finally, after losing myself in the labyrinth of errors, I humbly reached out for help to one of my instructors at Flatiron School. She requested my repo so she could try it out on her computer.
Within moments, she replied:
NPM INSTALL.
I FORGOT NPM INSTALL.
So why am I publicizing my insanity on the internet for all to see?
To help you, of course. So you don't do what I did.
Rather than going down the endless rabbit hole of finding where my mismatched versions of react were, which I didn't know how to do (or what that even meant), I should have stopped for a moment to think of a different strategy I could implement. To explore different options.
I should have gone back and traced ALL of my steps up until then, including making sure that I had initially set up my application with all of the necessary commands, rather than simply hyperfixating on one thing.
You see, sometimes it's good to persevere. To not give up. To keep on trying.
But sometimes, you just need to step back. Because what you're doing isn't working, and you need to find a different way.
And yeah.
Sometimes you just need to ask for help.
Subscribe to my newsletter
Read articles from Chaya Vogel directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Written by
Chaya Vogel
Chaya Vogel
Creative writer turned code writer with a passion for clean, organized code and a keen eye for design.