About the project
This is a simple project that demonstrates the power of being able to connect your app to live data. This is the first of my projects to incorporate JavaScript's Async-Await functionality. While the application itself is a small one, it came with a mountain of learning. To be able to adequately use these JavaScript features, it required a step up in my understanding of what is occuring "under the hood" when I run JavaScript code. Some major takaways from this project were:
- What JavaScript Promises are, how they work, and other nuances such as resolving Promises, when (and where) in your code you can get your data, and the basic concept that a typical API call requires a developer to deal with more than one Promise.
- The basic functionality of the fetch() function and the fact that it must be paired with the .then() syntax twice to actually get your JSON data.
- Working through the logic for how these functions are written, starting from a traditional fetch() function and refactoring by utilizing arrow functions and chaining to get to the sleek versions used most often.
- How the Async function and the fetch function are related along with understanding that a developer won't be able to rely on Async-Await alone; there are times when they each have their benefits.
What was the goal of the project?
I wanted to create a simple display that would pull some updated data and display it in a succinct way. I had recently learned how Async Await worked and wanted to give it a try in a small project. At the same time, I had written a few small projects in React and thought it would be a good opportunity to combine the two.
Project results
This application does exactly what I set out accomplish. I was able to successfully demonstrate the use of an API call in React using the useState and useEffect hooks.
Project completed on:
January 10, 2023