FoodMood

I wanted to learn Vue 3 properly, and reading about a framework does not tell you what it is like to live in. A recipe browser is a good shape for that: a list, a detail page, a search, and a third-party API that returns awkward data.

A Vue 3 front end over a public recipe API: a recipe of the day, browsing by category, a detail page with ingredients and method, and live search from the header. There is no backend and no accounts; it is a reading surface over someone else’s data.

Building it twice was the point. The first version was Vue CLI and webpack with the Options API; three months later I rebuilt it on Vite with script setup and the Composition API, and the second version gained the things the first one lacked, which were loading states, an error state and a real not-found page. Rebuilding something small that you already understand is the cheapest way to evaluate a toolchain change, because the only variable is the toolchain.

The honest cost of that rebuild: it dropped TypeScript. I would not make that trade again.

The category list is hardcoded rather than fetched. Search fires on every keystroke with no debouncing, and a search with no matches is not handled cleanly, because the API returns null rather than an empty list. There are no tests.

Still deployed, doing exactly what it did. It was a learning exercise and it is presented as one.