Phase 1 Project — Star Wars Archives

Unfortunately life caught up with me a bit with this project. I started a new part-time job last week, and unexpectedly had to work on each of the five consecutive days leading up to the due date. Then on the due date I had to go to a rental inspection and organise applying for a new rental. This left me with minimal time and energy to complete the project to a standard I would hope for. I managed to end up with a basic Minimum Viable Product, but I intend to keep working on it after the submission.

A challenge I encountered with this project had to do with using fetch and asynchronicity. I kept wanting to have functions which would simply return a value that was obtained from the API, but of course they returned promises, and it was not clear to me how to access the result of the promise outside of the function. The way fetch is used in the course examples is to do whatever manipulation needed to be done within the function that uses fetch. However, this became a problem when I wanted to construct lists for which each item needed to display a value from a different URL in the API. For some reason related the the asynchronicity, and possibly scope, appending these list items was not working. My suspicion is that when the function actually ran, it lost the fact that the variable that the list was assigned to was the actual list on the page. My solution to this was to use document.getElementById again inside each fetch function, rather than using the list variable that existed outside the for loop. Regardless, it seems clear that I need a deeper understanding of asynchronous functions and precisely how promises are used.