What to Eat - A Recipe Recommendation Engine 🌭πŸ₯«

What to Eat is a recipe recommendation engine that suggests recipes based on your dietary preferences and ingredients on hand β€” helping reduce food waste and make meal planning easier.

Recipe Generator UI Mockup Screen

What to Eat takes the guesswork out of meal planning. Whether you're working with limited ingredients or specific dietary needs, this app helps you discover recipes that fit your lifestyle. 🍽️ It's also a step toward reducing food waste by helping you use what you already have at home. 🌍


🍴 Try the App


πŸ’‘ Why This Project?

This started as a fun side project to explore TypeScript and Next.js. It’s grown into a tool I actually use when I don’t know what to cook. πŸ€“


🎯 Goals

  • βœ… Help users reduce food waste
  • βœ… Make meal planning easier
  • βœ… Inspire people to cook more at home
  • βœ… Empower users with dietary restrictions

πŸ§‘β€πŸ³ How to Use

  1. Click "Get Recipe" on the homepage
  2. Choose your dietary preferences
  3. Enter ingredients you have
  4. Hit Next to get personalized recipe ideas
  5. Click on a recipe to view details

πŸ› Known Limitations

  • Typos in ingredients may cause search failures β€” user input must be precise
  • Occasionally, the Spoonacular API may return ingredients outside selected dietary filters

πŸš€ Future Enhancements

  • Integrate NLP to auto-correct input typos in the ingredient form
  • Add meal planning features
  • Let users save favorite recipes for future access

πŸ›  Built With

  • T3 Stack
  • React
  • TypeScript
  • Next.js
  • Prisma
  • Tailwind CSS
  • tRPC
  • NextAuth.js
  • Spoonacular API
  • Canva / Figma

πŸ“± Live App

Explore recipe at πŸ‘‰ https://what-to-eat-2.vercel.app/