Build a calorie-tracker web app in a weekend

A useful calorie tracker needs three things: a food search, a daily list, and an explainable per-serving calculation. You can build all three as a single client-side page backed by DietlyAPI and the browser's local storage, with no server and no build step. This guide walks the whole app end to end, then shows where to grow it once people actually use it.

What you are building

One HTML file. A search box calls GET /search as the user types. Tapping a result adds it to today's log with an editable gram amount. A running total sums every entry using the same math. Everything persists in localStorage, so a refresh keeps the day. That is a genuinely usable tracker, and it never exposes a privileged key because the read endpoint is public.

1. Search foods as the user types