DEV Community


Posted on

I made my first app using React.

The mindset I had when creating this app was whether or not I was able to use it. I constantly have a problem when it comes to my fridge: too many ingredients not being used. Since quarantine has introduced many new activities to the average person, I thought it would also be something others could use as well.

Alt Text

The app, Clear Your Fridge, allows one to enter an ingredient into the search bar and it will return 10 recipes using that ingredient. When an ingredient is entered, each result will show an image of the recipe, other ingredients needed for the recipe as well as a link to the full recipe online.

The most challenging problem I had when creating this app was not creating a infinite fetch request from the API. This would have limited me from fetching from the API and I would not be able to test my app. I learned how that could become a problem and also was able to understand the error for future apps I create. I would say that I am pretty proud of the code that I wrote. Clean code was the goal of this app.

The app uses a third party API: Edamam. Unfortunately, this API is limited to only searching for recipes one ingredient at a time. I struggle with some CSS styling and want to improve on that aspect of my app. I want to include a video for each recipe or even search for recipes using multiple ingredients. I hope that I can get that working in the future.

As far as using React, there are a lot of aspects and concepts that I want to familiarize myself with. This was a good introduction to test how my knowledge. I plan to improve on this app and am welcome to critiques, comments, and advice. May this app be of use to anyone who comes by it.

Top comments (0)