How I built my first Javascript project using an API
The project that I built is a web app that returns a random activity to do. There are three ways to get this random activity. The parameters are the type of activity, the number of people, or the default random activity without any parameters. If a user really enjoys an activity, there is the option to like it and have it saved under liked activities. Here is a link to my project.
Starting a new project can be a little daunting at first. The first challenge was to pick an API that would fit my idea or vice versa. Initially, I had planned to use a different API than the one I ended up using but there were challenges accessing the information that I needed which were beyond my scope as a developer thus far. The API I ended up using is called the Bored API. To retrieve the information I needed, I used the fetch() API which allows you to retrieve information from an API as well as many other things. Using fetch you get back a promise that the server will return the information you requested. Once this information is sent back, you then need to translate it into the JSON format for it to be used in your code. Now once I did all that, I could see that for every fetch request to the Bored API, I would get back a random activity with some other information that I could provide as well. While making sure the API worked and I got back a response, I still didn’t know what I would do with this.
The next step was to go to the drawing board, literally. In order to create a project, you must first have an idea or vision of what you want it to do and look like. Because the Bored API is rather simple, I decided to use my knowledge of EventListeners to create a button that when clicked would return a random activity. And because there were multiple parameters one could search for when finding a random activity, I thought it would be cool to add a button for each parameter. With all this in mind, I sketched a design that would lay the groundwork for my project.
With the layout sorted, the API returning what I want, I could now begin coding actual JavaScript that would bring the project to life. And just like making a sketch for the design and concept of the project, I wrote exactly how I wanted the project to function. From there I only had minor hiccups and crafted my project with relative ease using the knowledge I have gained thus far from my coding Bootcamp.
What I learned from making a web app
One thing that I never thought of while building my project was how others would use it and experience it. Letting my parents test out “The Bored Button” made me realize that while it worked, it was not as user-friendly as I had intended. I completely ignored how a common person would view it and it resulted in confusion. I could have just left it to one button with optional multiple parameters. I now know that going forward, I have to give myself more time in thinking about the actual use case for the app, as well as how it will be used by common people. This also applies to the actual code as well, to make sure it is as abstract yet concise as possible so that it can be changed or rewritten without much hassle.
