DEV Community 👩‍💻👨‍💻

Baraa Baba
Baraa Baba

Posted on

It took me two hours to fix a really simple problem

I was working on my portfilio when an error happened about invalid hook calls I tried everything that the error said from trying to check if I am using hooks properly and making sure I don't have two different versions of react also for some reason I tried not to import my components dynamically apparently the error was just I deleted const Card =useRef() but kept the ref in the jsx and that was it I just have to delete ref={Card} I feel so stupid lol

my thoughts:

it's partially my fault cause I didn't think right since I already used hooks before without any problem so I had to know that the problem was from the Card and somewhat also react fault
idk tell what you think about this in the comments

Top comments (3)

sfleroy profile image

This is exactly where typescript and a good ide can save the day! But without.. We've all had one of those days at some point :) learn from it and move on ^_^

lukeshiru profile image
Luke Shiru

I'm a TS fan, but you don't need TS for this, you just need to have stricter JS settings. You can have a jsconfig.json in the root of your project with strict set to true, and it should catch this kind of thins even in plain JS.

baraa_baba profile image
Baraa Baba Author

You are right cause I think the ide should have warned me that I have a ref that was not defined.

🌚 Turn on dark mode

🔠 Change your default font

📚 Adjust your experience level to see more relevant content


Head to your account's Settings to do all this and more.