What's for Dinner? prepared by Rose's Kitchen is a website designed to help people reduce food waste and save money by generating recipes that include whatever ingredients the user has on hand. As college students, it is much easier to buy food than it is to cook and meal prep each week which adds up quickly especially if we spent money on groceries that we ended up not using.
What it does
What's for Dinner? prepared by Rose's Kitchen allows users to upload a image of an ingredient they have and from that the website generates a list of 10 recipes that uses the ingredient. It will also display a picture of the first recipe in the list and the nutrition facts for it.
How we built it
- HTML, CSS, and React is used for the front-end
- Google Cloud Vision API to determine the ingredient in the uploaded image
- Edamam Recipe's and Food Database API to get recipes and nutrition facts
- Flask to connect the front-end to the back-end
- Python was used to implement the back-end (making requests to the Vision API and the Edamam Recipe's and Food Database API, then delivering the response back to the front-end)
Challenges we ran into
- We had a hard time setting the google credentials for the Vision API to work
- Connecting the front-end to the back-end using Flask since everyone in our team has never worked with Flask before
- Understanding what React does and working with it for the first time
- We were conflicted on whether or not we should use a database to store the uploaded image paths since many online tutorials used them
- Converting the data returned from the APIs into JSON format