How did I get here?

Well, that’s a long story, but need not worry, I will save that for another post I wrote From Sales to Learning How to Code to Developer… Well Almost.

I’m here to talk about my attempt to finish a three-year-old unfinished React project called Highlander, a simple app for coaches to manage their team’s stats, trash talk, and poach players from other organizations. This post will probably end up being a series of blog posts, so follow me, and leave me your suggestions/comments I would love to hear your feedback.

When I first started to think about this project, it was during my coding Bootcamp days at Thinkful. To give you some more context, I was still relatively new to programming, held only one Web Dev/Design Internship at PicSpotr, and deployed a version of Highlander in HTML, CSS, jQuery, and PostgreSQL.

The task at hand was to complete a Capstone Project that required me to build a Fullstack Application with React. So I decided to take Highlander V0 and build a V1 in React. I was well on my way, and about 80% done with the project. However, I cut the project short due to a new gig I secured as a Technical Instructor at a non-profit called The Knowledge House.

Fast forward three years in a Corona Virus world. Like many others, I felt the wrath of unemployment. With new time on hand, I found myself re-visiting old unfinished projects with the intent of completion, Highlander being the first.

So I set out a plan, and after fumbling around for a day or two, I quickly realized I didn’t have a dam plan. I had to figure out how I was going to dip my toes into an older code base that I haven’t seen or touched in over three years.

So here we go, my initial thoughts on how I plan to tackle Highlander.

Go Back, 📓Read, and 🤔Understand the 🖥️Code to the Best of Your Abilities

There is a lot of value in reading the instructions when building your favorite IKEA set.

• BUY the IKEA set
• READ the instructions
• BUILD step by step

I overlooked these crucial steps in the past many times and found myself in IKEA nuts and bolts hell. The same can happen when working with older codebases that contain many pieces to a puzzle. One possible strategy to avoid this brings me to my next step.

🗺️Map out the Architecture on Paper

I’m a visual and kinesthetic learner. Whenever I find my self trying to organize all of my thoughts and assumptions in my head, I end up drawing it out, helping with my long term memory.

After reviewing the codebase and hopefully understanding the flow, I plan to map out the architecture on paper. Initially, I plan to connect a few boxes, circles, and lines to each other, depicting the flow of the application in a visual format. And with more time and understanding of the codebase, I believe my architectural diagram will mature with much needed specific detailed drawings and annotations.

Next.

NPM start my Project and use the Errors as a Starting Point.

By now, I should have a decent comprehension of the overall direction of the codebase. Now I need to get my hands dirty and start plugging away at some code. But first, what kind of bugs am I inheriting from three years of dusty code, deprecated NPM modules, security issues, and overall architectural modifications to the React library. My anxiety is kicking in 😬😬😬.

But I need to start somewhere, and what better place to start than the line the code that broke the project.

Lastly.

Code. Visit Architecture. Read Documentation. Fix Errors. Repeat.

Basically, at this point, its rinse and repeat. As I work through the project I’ll be sure to document and write about my journey on both a technical and process level.

Let’s get to work 💪💪💪.