FoodSnapAI is a modern web application that allows users to upload photos of dishes, discover new recipes, and share their culinary creations with a vibrant community. The project leverages React, Next.js, and a stylish, responsive UI to deliver a seamless food discovery and sharing experience.
- Image Upload: Effortlessly upload dish photos with drag-and-drop or file selection.
- Recipe Discovery: Browse and explore a variety of recipes from around the world.
- Social Integration: Connect with FoodSnapAI on Instagram, Twitter, TikTok, and LinkedIn.
- Responsive Design: Optimized for desktop, tablet, and mobile devices.
- Modern UI: Smooth animations and a clean, user-friendly interface.
- Newsletter Subscription: Stay updated with the latest recipes and cooking tips (coming soon).
- Frontend: React, Next.js, TypeScript
- Styling: CSS Modules
- Icons: Lucide, React Icons
- Backend: FastAPI, Google Cloud Storage
- AI: Gemini Multi Agent System
This project uses a modular Agentic Pipeline defined in agents.py to transform food images into structured recipes and nutritional data. Instead of a single prompt, the system breaks the task into specialized stages.
The workflow is orchestrated by a SequentialAgent called the root_agent, which passes data through the following experts:
- The Filter (
checking_agent): Validates that the uploaded image contains actual food rather than people or objects. - The Chef (
recipe_agent): Identifies ingredients and generates a from-scratch recipe—even reverse-engineering packaged snacks like chips or soda. - The Nutritionist (
calories_agent): Estimates calories per 100g and total weight, accounting for cooking methods like frying. - The Analyst (
health_categories_agent): Tags the dish with dietary labels such as "Vegan," "Halal," or "High Protein". - The Shopper (
delivery_agent): Generates localized Google Search links to help you buy the required ingredients based on your location. - The Auditor (
final_agent): Validates all data for consistency and packages it into a final JSON response.
All logic for these interactions, including specific model instructions for the gemini-2.0-flash model, can be found in agents.py.
Food Snap AI video demonstration: https://drive.google.com/file/d/1LORKBxksoeOcmvYVumXHNFUr8nT6Ftii/view?usp=drivesdk
- Node.js (v16+ recommended)
- npm or yarn
-
Clone the repository:
git clone https://github.com/your-username/foodsnapai.git cd foodsnapai -
Install dependencies for frontend:
cd frontend npm install # or yarn install
-
Run the development server:
npm run dev # or yarn dev -
Open http://localhost:3000 in your browser to see the app.
The backend is responsible for handling image uploads, recipe data, and user interactions.
Stack: FastAPI
- Image Upload API: Receives and stores user-uploaded dish images.
- Recipe API: CRUD operations for recipes.
- User Management: (Optional) Authentication and user profiles.
- Integration: The frontend communicates with the backend via RESTful API endpoints.
-
Go to the backend directory:
cd back -
Install dependencies into your venv:
pip install requirements/dev.txt
-
Start the backend server:
uvicorn src.main:app --host 0.0.0.0 --port 8000
-
The backend will run on http://localhost:8000 (or your configured port).
- Colors & Theme: Edit CSS variables in your global styles or module CSS files.
- Social Links: Update URLs in
Footer.tsxto point to your own social profiles. - Images: Place your logo and other images in
public/images/and update imports as needed.
Pull requests are welcome! For major changes, please open an issue first to discuss what you would like to change.
This project is licensed under the GNU General Public License v3.0.
See the LICENSE file for details.