Hungry Hungry Hippos

Inspiration

As university students we have a hard time figuring out the variety of food we can make from the ingredients we already have, Hungry Hungry Hippos aims to solve that and reduce food waste by reminding us to use our soon to be expiring food.

What it does

Your application is a comprehensive kitchen management system that:

Inventory Management: Tracks items in fridge and pantry with expiry dates and locations
Smart Recipe Generation: Uses AI to generate recipes based on available ingredients
Dashboard Analytics: Shows recent activity, expiring items, and kitchen alerts
Recipe Collection: Allows users to save, favorite, and create custom recipes

How we built it

The tech stack includes:

Frontend: React with TypeScript, using Vite for development
Styling: Tailwind CSS with custom CSS files for specific components
UI Components: Radix UI components with custom styling
Backend Integration: RESTful API calls to a Node.js backend
Database: Prisma ORM integration
Authentication: JWT token-based authentication

Challenges we ran into

API Integration: Complex recipe generation with the AI service such as error handling
Recipe: Configuring user preferences, database (for ingredients), and settings for recipe generation
Component Architecture: Building reusable UI components while maintaining consistent styling
Converting Figma to Code: The User Interface was designed on Figma and converting that to react turned out to be a challenge

Accomplishments that we're proud of

Complete Full-Stack Application: Built a working end-to-end system with authentication, data persistence, and AI integration
Polished UI/UX: Beautiful, responsive design with custom animations and the charming hippo theme
Smart Features: AI-powered recipe generation that considers available ingredients and dietary preferences
Comprehensive Functionality: From inventory tracking to recipe management, covering the full kitchen workflow