Added FoodSnap AI Solution – Kerala Food Image Detection with Nutrition Analysis

[Sourav4554]

🍛 FoodSnap AI

🌐 Live Demo 🔗 Live Project: https://foodsnap-ai.onrender.com (I hosted the backend on Render free tier, so it takes 5s initially to load the server when the first user appears)

Personal Project
Detect and analyze Kerala food items instantly through image recognition.

📖 Description
FoodSnap AI is a smart web application that allows users to snap or upload pictures of food—especially Kerala traditional dishes—and instantly receive detailed macro nutrient information, including calories, protein, carbs, sugar, fat, and fiber. It solves the lack of nutrition data available for local Kerala food by using a custom-trained AI model.
The application also allows users to adjust food quantity and receive updated nutritional values accordingly, making it an essential tool for health-conscious individuals in Kerala.

✨ Features

🥘 Recognize Kerala local food items via image upload or webcam.
⚡ AI-powered food detection using a custom Teachable Machine CNN model.
🍽️ Displays macro nutrients: Calories, Protein, Carbohydrates, Fat, Fiber, and Sugar.
📏 Dynamic quantity adjustment with real-time nutrition calculation.
📱 Responsive UI for mobile and desktop users.
📸 Image compression before upload for performance.
🚨 Friendly alerts and smooth navigation.
🛠️ Tech Stack

##Frontend
React.js
Tailwind CSS
Lucide-react (icons)
React Router DOM (navigation)
SweetAlert2 (alerts)
Compressor.js (image optimization)
Axios (API handling)
Google Teachable Machine (custom-trained CNN model)
TensorFlow.js

##Backend
Node.js
Express.js
MongoDB (via Mongoose)
CORS
compression
Dotenv
Nodemon

Hosting
Render (for both frontend and backend)

💻 Getting Started (Local Setup)

Clone the Repository
git clone https://github.com/yourusername/foodsnap-ai.git
cd foodsnap-ai

🧩 Installation Setup
🔹 Frontend
npm create vite@latest client
cd client
npm install axios react-router-dom sweetalert2 lucide-react compressorjs
npm install tailwindcss @tailwindcss/vite
npm install teachablemachine/image

🔹Backend
mkdir server
cd server
npm init -y
npm install express mongoose cors dotenv
npm install nodemon

🔹env
MONGO_URI=your-mongodb-connection-uri

Limitations

only trained these food items
The accuracy rate is not 100%

"chappathi",
"chicken recipe",
"chicken biriyani",
"egg recipe",
"idili",
"idiyappam",
"kadala curry",
"payassam",
"Porotta",
"puttu",
"sadya"

🎥 Demo Video
📹 Watch the Demo Video on YouTube(https://youtu.be/ETo3jQP1cGs)

[Sourav4554]

please check and give feedback