SMART REFRIGERATOR:
🧱 Tech Stack
Backend: Flask (Python) – talks to the fridge hardware (camera, sensors, etc.)
Frontend: HTML + CSS + JS (basic dashboard)
Database: SQLite (can later upgrade to Firebase or cloud DB)
App Hosting: Runs locally or on Raspberry Pi; can be exposed to phone via local IP
or ngrok.
Tools You'll Need
Camera (USB webcam or Pi Camera)
Raspberry Pi or Laptop with Python
Pre-trained ML Model (we'll use TensorFlow + MobileNet for now)
OpenCV for image capture
Same Flask backend to update inventory
💻 Step-by-Step: Smart Fridge App (MVP)
1️⃣ Backend – app.py (Flask)
python
CopyEdit
from flask import Flask, render_template, jsonify, request
import sqlite3
app = Flask(__name__)
# --- DB Setup ---
def get_db_connection():
conn = sqlite3.connect('fridge.db')
conn.row_factory = sqlite3.Row
return conn
@app.route('/')
def index():
conn = get_db_connection()
items = conn.execute('SELECT * FROM inventory').fetchall()
conn.close()
return render_template('index.html', items=items)
@app.route('/api/items', methods=['GET'])
def get_items():
conn = get_db_connection()
items = conn.execute('SELECT * FROM inventory').fetchall()
conn.close()
return jsonify([dict(item) for item in items])
@app.route('/api/add', methods=['POST'])
def add_item():
data = request.json
conn = get_db_connection()
conn.execute('INSERT INTO inventory (name, quantity) VALUES (?, ?)',
(data['name'], data['quantity']))
conn.commit()
conn.close()
return jsonify({"status": "success"})
@app.route('/api/delete/<int:item_id>', methods=['DELETE'])
def delete_item(item_id):
conn = get_db_connection()
conn.execute('DELETE FROM inventory WHERE id = ?', (item_id,))
conn.commit()
conn.close()
return jsonify({"status": "deleted"})
if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0') # For LAN access
Database Setup – fridge.db
-- Run this once via sqlite3 or Python
CREATE TABLE inventory (
id INTEGER PRIMARY KEY AUTOINCREMENT,
name TEXT NOT NULL,
quantity INTEGER NOT NULL
);
Image Classifier Script – classify_image.py
pip install tensorflow opencv-python flask numpy pillow
import tensorflow as tf
import numpy as np
import cv2
from PIL import Image
# Load pretrained MobileNet model + labels
model = tf.keras.applications.MobileNetV2(weights='imagenet')
decode_predictions = tf.keras.applications.mobilenet_v2.decode_predictions
input_size = (224, 224)
def classify_frame(frame):
# Resize & preprocess
image = cv2.resize(frame, input_size)
image = tf.keras.applications.mobilenet_v2.preprocess_input(image)
image = np.expand_dims(image, axis=0)
# Run through model
preds = model.predict(image)
decoded = decode_predictions(preds, top=3)[0]
# Show top 3 predictions
return [(label, float(prob)) for (_, label, prob) in decoded]
if __name__ == "__main__":
cap = cv2.VideoCapture(0) # 0 = default webcam
while True:
ret, frame = cap.read()
if not ret:
break
predictions = classify_frame(frame)
# Display predictions
for i, (label, prob) in enumerate(predictions):
cv2.putText(frame, f"{label}: {prob:.2f}", (10, 30 + i*30),
cv2.FONT_HERSHEY_SIMPLEX, 1, (0, 255, 0), 2)
cv2.imshow("Smart Fridge Camera", frame)
if cv2.waitKey(1) & 0xFF == ord('q'):
break
cap.release()
cv2.destroyAllWindows()
Frontend – templates/index.html
html
CopyEdit
<!DOCTYPE html>
<html>
<head>
<title>Smart Fridge</title>
<style>
body { font-family: sans-serif; padding: 20px; }
.item { margin-bottom: 10px; }
</style>
</head>
<body>
<h1> What's in the Fridge? </h1>
<div id="items"></div>
<h2>Add Item</h2>
<input id="name" placeholder="Name">
<input id="qty" type="number" placeholder="Quantity">
<button onclick="addItem()">Add</button>
<script>
async function loadItems() {
const res = await fetch('/api/items');
const items = await res.json();
const container = document.getElementById('items');
container.innerHTML = '';
items.forEach(item => {
container.innerHTML += `
<div class="item">
${item.name} (Qty: ${item.quantity})
<button onclick="deleteItem(${item.id})">❌</button>
</div>`;
});
async function addItem() {
const name = document.getElementById('name').value;
const qty = parseInt(document.getElementById('qty').value);
await fetch('/api/add', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ name, quantity: qty })
});
loadItems();
async function deleteItem(id) {
await fetch(`/api/delete/${id}`, { method: 'DELETE' });
loadItems();
loadItems();
</script>
</body>
</html>