Okay, I knew it’ll be a struggle to learn anything new, especially something as foreign to myself as programming, but then that’s why reliable guidance is important because, whatttttttt!
So, ever since I left my job in August I’ve been working on a portfolio website. I did an interview shortly after quitting that humbled me and made me realize that I didn’t know shitt! Okay fine, I do know some stuff, but clearly not to their expectations cause dangggg, I flopped hard. Even though I have reservations about the role I was interviewing for; they seemed to be wanting an expert with a beginner title, but still.
I decided to take programming a bit more seriously and decided to build myself a portfolio website. No code alongs, I’ll use what I already know and what I didn’t know, I’ll find. But I wouldn’t be doing a word for word code along. I wanted to be able to defend what I put down and show case as many of my skills as I can.
And it’s been going great! Like fantastic! It’s been hard and taking longer than I planned, but it was coming together nicely, that is up until about a month ago when it stopped working. Literally.
It’s a react application. A dynamic website that’ll be simple enough to handle, but still show that I got a clue, you know, something not too shabby… And we’ve been taking it slow and steady, up until the home page stopped working. Ahn ahn. Why? It was working a second ago, I didn’t edit anything so what’s happening? Is it the routing? That worked perfectly fine, I’d been trying to grab a hold of React Router for a minute and now it works. But why is it malfunctioning? Is it my internet? Reload the page. Close it and reopen. Shut down and restart. Nothing worked. I was scared. I didn’t want this to become an abandoned project. I didn’t want to leave it, I wanted to find the error fix it and make it work, but no matter how much I looked it over, I couldn’t find what was wrong.
Okay okay, we’re solution oriented, we’re AIESECers, we find ways when there’s no way. And to be programmers, we have to be problem solvers. Okay, we’re doing this. We’re fixing it.
First, find what the problem is <there’s going to be a lot of programming beginner gibberish, you could sit through it or skip this paragraph>. The react router is in the navbar component, I linked the logo to “/home” to display the Home page. There’s also a navlink; “/projects” to a “Projects” page. “Localhost3000/projects” would display in the browser just fine but “localhost3000/home” wouldn’t. Imported home page to app.js and bypass the router, it would display, but navbar logo and /home wouldn’t, just a blank white page after it’s done loading. I Checked how I imported home page to the navbar component, it’s same as the project’s. Changed the name /home to something else; homer, homes, even the name of the function being exported from the home page as well, no difference. Switched /projects for /home and vice versa, no avail. It was clear at this point that it wasn’t the name “/home”, but the home page that refused to work with the routing and I couldn’t figure out why.
I go to stack overflow, the problems those ones are having there aren’t the same as my own. I Google other sites and I’m not finding what I’m looking for. At this point it’s beginning to get to me but no, we’re not getting frustrated over this, no. I’ll leave it for a bit and come back.
I casually mentioned it to a tech bro I know, he said to send it to him. Figured out how to push to GitHub and send him link. Days later he says he’s fixed it. I’m over joyed but still don’t check it yet.
In the time that I’ve left it, I’ve finished two Coursera courses and applied for other stuff + had numerous lazy days. But still, we mustn’t give up, so we keep it in mind, randomly watch YouTube videos to see if I’ll see something, a different way, some similar error, anything.
Yesterday I gather liver, opened GitHub, merged his changes and pulled. Baba had un commented the home page importation to app.js completely bypassing the routing and missing the point of the problem. 😒. I was so pissed. I kinda knew he wouldn’t have made it work the way I wanted it to despite my explanations, maybe I didn’t explain well enough, but either way sha. Problem unfixed.
Today I saw make we look am again. I prayed,
Heavenly Father, please help me with this, I don’t care how stupid finding it would make me feel, just help me find it and fix it.
Then made my way to YouTube again. Watched routing tutorial, mine was as perfect as theirs and theirs worked! It was At this point frustration began to set in. I was determined to host it even if I couldn’t find the issue. I began tweaking things, delete the entire home page, rebuild it, dismantle stuff and bring back together.
I then thought back to the last major thing I did. I created an about us page and linked it to a component on the home page with another router.
I comment out the router bits and /home works again!
NO ONE TOLD ME YOU CAN’T USE TWO ROUTERS ON A SINGLE REACT APP! JEEEZZZZZ! WHAT THE HECKKK!
I don’t know whether to feel foolish that I didn’t think to undo the last major thing I tried before it all went haywire or happy that I had learned something only experience would teach you.
In my defense, I had turned off autosave; my system is slow and I didn’t want the app reloading everything I type a letter. So I had done a lot before I saved making it harder to pinpoint the mistake . And, I assumed the issue was with the home page not another page linked to it about two pages away.
Anyway, problem solved. Website building continues. We move.
Moral Lesson: Sometimes you wouldn’t find your errors on stack overflow, try stuff undo shit. You made it, it’s not magic, you can break it and rebuild it better.
Also, Jesus answers prayers.
The Almost Tech Sis 