What's in the Fridge?
What’s in the Fridge? helps users find recipes based upon ingredients they already have in their fridge! We drew inspiration from many recipe sites but ulitmately decided to create our own unique take on how to search for dinner tonight.
Technologies & Technical Challenges
- Node JS
- React JS
- BCrypt, JSONWebToken, Passport for user authentication
- Bodyparser middleware
- Edamam Recipe and Ingredient API
There are three main components to the site, the fridge, recipe search, and grocery list. The fridge is where you can track ingredients you actually have in your refrigirator at home! Once you have added a few food items to your fridge you can search for recipes that include the ingredients in your fridge list. For the ingredients you don't already have at home when you save a recipe it will auto-generate a grocery list for you!(grocery list feature currently in development!) The recipe and ingredient search features are powered by the EDAMAM API.
The fridge is a list of food items that the user inputs based upon the food items the user has. This list populates the main search inputs.
Once a user has populated the fridge list, the user hits search. After hitting search, the search function makes a call to the Edamam API which returns results.
Below is a snapshot of the main functionality of the advanced search. The advanced search interpolates a string based upon user inputs and sends that string interpolation to the API. A more complete advanced search feature could be implemented with a paid version of the API, but our free version limits the scope of coverage for inputs.
The search results show a picture of the recipe and provides 4 action options for users. A user has the option to follow a link to the actual recipe or save the recipe. In addition, a user can expand either the health facts or the ingredients from the recipe.