Inspiration
Do you have groceries that you don't want anymore? Are you about to go on vacation, but your fridge still has perishable food? We wanted to build a tool that lets you share these groceries with your coworkers. To streamline the user process, we integrated a chatbot that can query the database and a recipe finder.
What it does
Vultures is a smart recipe finder that helps users discover meal ideas based on available ingredients. Users can:
- Add grocery items that they want to give to their coworkers
- Browse a database of grocery items
- Find recipes that use the grocery items in the database
- Speak with a chatbot to learn about the grocery items
How we built it
- Frontend user interface: Vultures was built primarily using React for the frontend user interface, leveraging functional components and hooks (useState, useEffect) for state management and side effects.
- Data Storage: We used Firebase Firestore as a NoSQL database to store and retrieve the list of "common fridge" ingredients, ensuring easy management of default pantry items.
- Recipe API: The core recipe search functionality is powered by the Spoonacular API, which allows us to query for recipes based on ingredients and retrieve detailed information including images and ingredient lists.
- Chatbot: We leveraged OpenAI to create a chatbot that reads metadata from Firestore.
- Ingredient Management Logic: Custom JavaScript logic within React hooks handles the combination of Firestore-fetched and user-entered ingredients, deduplication, and the crucial step of identifying which of the user's input ingredients are actually utilized (or not utilized) by the fetched recipes. We specifically augment the Spoonacular response to add an isPersonal flag to used ingredients for bolding in the UI.
Challenges we ran into
- API Integration Complexity: We needed to handle the complexity of successfully integrating with the Spoonacular API and the chatbot.
- UI Design: Creating a simple and effective UI.
Accomplishments that we're proud of
- Waste Reduction Focus: Our product allows users to reduce food waste.
- Focus on Community: Our product provides a fun way for users to interact with their coworkers.
What we learned
Building Vultures reinforced our understanding of several key development concepts:
- Advanced React State Management: Deeper dive into using useState and useEffect for complex, interconnected state logic.
- External API Interaction: Best practices for fetching data, handling asynchronous operations, managing API keys securely, and processing diverse API responses.
- Data Transformation and Manipulation: Techniques for cleaning, combining, and transforming data from different sources to fit application requirements.
What's next for Vultures
We have many exciting ideas for Vultures' future:
- Dietary Filters & Preferences: Implement options for filtering recipes by dietary restrictions (vegetarian, vegan, gluten-free), cuisines, or meal types (breakfast, lunch, dinner).
- Saved Recipes: Allow users to save favorite recipes and maintain their personal ingredient lists.
- Shopping List Generation: Based on chosen recipes and available items, automatically generate a shopping list for missing ingredients.
Log in or sign up for Devpost to join the conversation.