A smart system for creating recipes based on available ingredients.
An interactive, responsive React web application that acts as an intelligent kitchen assistant. The application leverages AI to generate customized cooking recipes based on the ingredients a user currently has at home.
- Dynamic Ingredient Management: Users can add and manage a list of available ingredients with built-in validation (prevents duplicate entries and handles empty inputs gracefully).
- AI-Powered Recipe Generation: Integrates with the Hugging Face API to instantly process the ingredients list and generate a complete, creative recipe.
- Seamless UX/UI: Designed with smooth interactions, including auto-focusing input fields after submission and a clean rendering layout for the generated recipes.
- Component-Driven Architecture: Built with highly reusable React components (
Form,IngredientsListItems,Recipe, etc.).
- Frontend Framework: React.js (built with Vite)
- State Management: React Hooks (
useState,useEffect) - AI Integration: Hugging Face API / Inference Models
- Styling: CSS3 (Modern responsive layout)