DEV Community

Jason
Jason

Posted on

My First Front End API Project

A week ago I couldn't tell you the first thing about using an API. I had a vague idea about what an API was but no real grasp on the power they contain. As a student in the DigitalCrafts web developer program I was tasked with creating a functional and interactive website using one or more APIs. The rest was up to me. Being the big nerd that I am, I knew I wanted to make something related to comic books. I decided that since more people care about the blockbuster Marvel and DC movies than the comic books themselves, I could help bridge that gap and, hopefully, convert a few to comic book readers. The app I created allows users to search for any comic book character and discover more information related to that character with an emphasis on movie appearances.

The first major hurdle of this project was to find one or more publicly available APIs that would help me achieve my goal. There are a lot of public APIs out there with varying degrees of ease and usefulness. I tried out more APIs than I would have liked. Some were difficult to navigate. Some were difficult to setup. Some had little to no documentation. Some had tiny API request limits. Some just didn't have the information I needed. Finally, I decided to use the APIs from ComicVine and TheMovieDB.

The next task was to read through all the API documentation and familiarize myself with how to use them. This was somewhat difficult with the ComicVine API. Their documentation is not all that thorough and not updated often. I relied heavily on forum posts and Google searches to find what I needed. The TMDB API documentation has much more detail and scope. The only downside was the testing feature on the developer website did not work. But both were completely free with basically no request limits so a huge thanks to both.

Designing the site took a lot of trial and error. I coded all the HTML and CSS myself for the most part rather than using a bootstrap type approach. I definitely relied on examples from around the web. I wanted something that had a relatively modern feel and allowed the user to find what they want quickly with as little clutter as possible. I enjoy minimalist web pages that put the content front and center so this was a major goal for my app. The final road block in the design was making everything mobile responsive.

Though this project was frustrating at times it was a great experience. I think learning how to use APIs was valuable but the bigger take away for me was learning how to prioritize what to work on next, how to test things quickly to see if it works for the project, and when to move on from something when it's not working. There were several features I wasn't able to implement in the time I had and design choices I had to make that weren't exactly the aesthetic I wanted but overall I am satisfied with the final result. I would like to continue to work on this project and make it more feature rich in the future.

You can check out this project on my GitHub Repository.

Top comments (0)