useHistory, Don’t Repeat My Mistakes.

Akil Griffiths
2 min readDec 22, 2020

I might have mentioned that I have worked on some apps. Nothing too fancy yet, but I am proud of them. There is one app in particular that I have to look back on now, it was a simple game review app. I stopped working on it because it was living up to my expectations, and it wasn’t broken. It was functional but it wasn’t done correctly?

I learned this by working on a different project, that game I keep talking about. Now without going into too many details of the game, the person helping me was asking why I was using window.location to change the page. My previous experiences led me to believe this would be fine. The way I had it setup so far reinforced the idea that this was okay. Then I tried to pass down some more props.

Now in the same review app I ran into a problem with that location method. I know this because I was using localStorage to persist the name of the person signing in instead of just passing it down as a prop. In this app that was the only thing I was passing down, also if the page refreshed it was guaranteed to show the updates because my backend fetch was done correctly. So in this scenario it was working like I wanted it too but was still bad coding on my part.

Back to Building The Game

It was working as intended until, it came time to pass down props. Now I can’t recall if it worked when first getting to the page, and more calls to change the location deleted the props, but as I’m looking to write code that works all the time, there’s no need to find such a distinction. My collaborator told me it is throwing these errors now because I wasn’t using the history method.

After changing all of the window.location bits to incorporate history instead, I had an app that was running again. This time it did not just appear functional, it actually is. I still have a lot of work to do on this game app, but I can relax knowing I’m doing many things right… probably.

--

--