Creating my first HTML, Javascript, and Css, API fetch’d website was a amazing experience I’d like to share! At first, I was over whelmed by the idea of starting fresh. With a blank page staring back at me, I had to break down what I was going to make and how I was going to achieve that goal. Step by step, I pieced together a plan to tackle this idea in my head.
Designing an Outline
I started off by setting up an HTML file with headers and tags that would best represent the basics of how my site would look! This way, I could create all of my functionality(‘manipulate the DOM’) with an existing basis to work around. I also, searched through and played with the API that I was going to be using as knowing which endpoints would work for my website was key to making it a success. After finding out that the only way a passing fetch would work was by providing a mandatory artist name and song entry, I realized some of the things I would wan to do was going to be difficult to design.
ERROR!
Constantly going back and forth, weaving through my code in search for what was going wrong was exhausting. Function by function, I slowly had pieces of functionality working in the ugliest was possible. I set up the functions in such a way that they would not be well to work with which was frustrating. I would create something, get it to display what I wanted in that particular time, but then couldn’t get it to display something else forcing me to restructure the way thing were being done. To reach my main goal of simply getting lyrics, it took me an entire day to debug valid input entries to display the correct information.
Learning experience!
Breaking down pieces of functionality into their own separate spaces really does help with the debugging and manipulation processes. I learned that searching through code becomes easier when you have made it clear where what is going on. Logically you can decipher what is being called at what time in order, helping with how one should approach the next step towards the end goal. But, it is also important to be patient with the process, as sometimes things need to look bad so it can then be made good, and that is ok. Finding simpler and more optimal ways come after your initial goal, and that is something that I believe every developer should think about when tackling problems.
