Insta Recipe: AI-based Food Image Recognition with Recipe Discovery

Overview & Purpose

Insta Recipe is a Next.js web application that identifies a dish from an uploaded image and provides users with its key ingredients, a suggested recipe, additional images, and even related links to Pinterest and YouTube. The main motivation behind this project was a spark of inspiration I thought it would be both fascinating and practical for anyone curious about recreating a dish they come across.

What Was Used

To build this project, I utilized a modern tech stack and a couple of cloud services:

Google Gemini API
To analyze the uploaded food images and generate ingredient lists, recipes, and related dish information.

Supabase
For user account creation and image handling. This setup allows users to sign up, upload images, and retrieve results securely.

JavaScript
For handling client-side interactions and fine-tuning app logic.

Search Queries
Dynamically constructed queries (using the recognized dish name) to generate relevant Pinterest and YouTube links.

Challenges

This project presented several challenges, each offering valuable learning opportunities:

Supabase Integration
The biggest hurdle I faced was integrating Supabase for user account creation and image storage. As this was my first time using Supabase, I encountered a learning curve in configuring authentication, database rules, and ensuring a smooth user experience.

Key Features

Food Recognition & Recipe Generation
Users can upload a food image, and within seconds, the Google Gemini API identifies the dish, suggests possible ingredients, and provides a recipe outline.

Additional Food Images & Quick Links
It also fetches related images of the recognized dish. Moreover, it generates dynamic links to Pinterest and YouTube, giving users instant access to more ideas, tutorials, and visual inspiration.