Refactoring

October 31st, 2019
refactoring

The spookiest way to celebrate Halloween


In my last post, I was at the point of nearly giving up on a project-based assessment for Hatchways.io. I was completely stuck and at a point where I could not go any further with what I knew at the time. This is where a good community standing behind you becomes important. As I always do, I posted to Twitter my daily post for #100DaysOfCode and also said in that post that I was at a deadlock. Right after I posted this, I sent my pair-programming buddy, Matt Bear, a message to see if he could hop on Zoom and take a look at my code. He got right back to me and was more than willing to donate his time to my cause. He spent nearly 2 hours working with me to clean up the remainder of the logic and showed me quite a bit in the areas I was struggling.

After doing some final styling of the app to get it looking close to what it was supposed to look like, I wrote a readme and a config.json file for the app and submitted it for approval. All of the requirements of the assignment were met and there were no errors that I could find, so I felt pretty comfortable in the submission. There were still quite a few things I could do to clean it up, though, in the way of refactoring and organizing the codebase. I noticed that after I submitted it, this opened up a new spot in the assignment where you could revise the code and resubmit. I spent 12 hours working outside today, most of the time pouring over the code in my mind and thinking of all the things I could do to make it better. As soon as I got home and took a shower, I got to work on it. Most of it came to destructuring props and state to clean it all up, along with creating a subfolder to hold all of the components. Unlike many frameworks(React is not a framework!), React has no true convention or best practice for file systems, but there are several patterns that most people will adhere to so the app is more reader-friendly. Since there were only 4 components in total of this app, I just put them in one folder and separated them from the rest of the code in the app. I may still go back and do another refactor, creating more child components to break them up a bit. There's one big issue that I still have with my app, and one that I almost solved today but actually created an error in the process: I have 2 places where my state resides, and one of them is in the grandchild of the parent component. While this certainly doesn't break the code, it's not ideal in React and definitely something you want to avoid. Matt and I have another pair-programming session tomorrow, so maybe we can take a quick look at this.

I've known for some time now that Matt was well past my skill level, but I was blown away by his level of knowledge last night. He gives me something to aspire to, and I'm hoping I can reach his level in a hurry. I think if I keep working with him every week on pair programming, he's really going to help me advance my skills, and maybe I can reach his level a little faster. However, I suspect by the time I get to where he is now, he'll be leaps and bounds ahead of where he currently is. Matt is on the brink of getting hired, and I think he's well past the point of being employable in this industry. His level of knowledge is really advanced, and I think he could probably skip the junior-level and move right into a mid-level developer position with ease. He's also very personable, which will really separate him from the rest of the candidates wherever he chooses to apply. I consider him to be a mentor for me in a lot of ways, which I think is a huge win for me.

Until tomorrow!

Created by Sam Thoyre, © 2019