DEV Community

Cover image for Modern Recipe URL to 🍬 Sugar Level Estimation Web App From Scratch
Yeow Zi Qin
Yeow Zi Qin

Posted on

Modern Recipe URL to 🍬 Sugar Level Estimation Web App From Scratch

Overview

When users input the recipe url into the text prompt, the web app will extract the ingredients out of the recipe url using cheerio and forward to a deep learning model exported in onnx format and was trained using HuggingFace Trainer, lastly, sugar level will get returned.

ingbetic.vercel.app

The AI model is deployed at the edge, which means the AI model will get loaded at the client side using onnxruntime with wasm backend, no custom Python backend is required which drastically reduce the deployment costs.

Try it here: https://ingbetic.vercel.app/

Technology used

Frontend

  1. Next.js - Full Stack React Framework
  2. Typescript - Superset Form of JS
  3. TailwindCSS - Utility CSS Class
  4. Reactflow - Node-based Interactive Editor

Model

  1. Python - Prog Lang
  2. HuggingFace - Hub for Model & Dataset
  3. ONNX - Quantization & Inference

See the open source code below

https://github.com/ziqinyeow/ingbetic

Top comments (0)