Phase 1 Project
Project weeks are always very stressful but this one was a little different. For this project, we had to utilize all the skills we have been learning from the past two months and a create a simple app. To say the least, I was lost on where to even begin lol but I powered through and ended up completing and passing! This blog is about the trials and tribulations I had to face and the small victories won.
For my project, I decided to create an app that displays Rick and Morty characters and lets users express if they like them by clicking on a like button. My first hump to get over was to figure out how I can get my data that I fetched from the Api, to display on the Dom. With a couple google searches and help from my instructor, I figured out that I was not invoking the functions I needed. Yes! one small victory. Next, was a little more difficule fot me. I had to figure out how to get the certain data I needed within the nested arrays of data. Thanks to an amazing classmate I was reminded of the dot and bracket notation used to access data in arrays. Another victory!
This next problem was the hardest and most frustrating for me. From the data of my API, I wanted to display the first page of 20 characters on the Dom with the specific information I needed. I tried all different kinds of For loops but I just could not figure this one out! With the due date approaching, I had to improvise. I ended up creating the elements for each character, displaying the information for those characters and then appending to the Dom. It was a long (and messy) process but it got the job done.
Lastly, I needed to add EventListeners so users can actively interact with my app. I first decided to just do an alert that lets a user know that they liked a character. However, when I had my project review with my instructor, he challenged me to implement a counter that keeps track of how many times a character was liked. So far, I have gotten one button to work (yay!) but I am still struggling with the other buttons.
Overall, for a first real project I am proud of what I’ve accomplished so far but I know that I can do way better! This is still a work in progress and I will updating and upgrading this app to make it even better. Here’s a link so you can check out my page and track my progress!
rickandmorty-likeapp.netlify.app
Also here is a link of a walk through of my project.
