Web App2025Live

RecipeNest

Recipe discovery app built with React, searchable recipe results, filters, favorites, dark mode, and detailed recipe pages powered by a recipe data API.

RecipeNest interface
Client
Personal Project
Roles

Frontend Development

Search UX

API Integration

Tech stack
ReactJavaScriptEdamam APITailwind CSSVercel

The outcome

Delivered a fast deployed recipe browser with ingredient search, cuisine and dish-type filters, saved favorites, and recipe detail routes for meal planning.

01

Search First, Filters Second

RecipeNest begins with one familiar action: search for an ingredient or dish. Cuisine, meal, and dish-type filters appear once results exist, keeping the first interaction approachable without removing depth from later exploration. The product tradeoff was to delay complexity until it could help instead of displaying every control because the API happened to provide one.

02

API Data Needed a Product Shape

The recipe API returns data; it does not design the browsing experience. Results are shaped into visual cards for scanning, while dedicated detail routes hold the ingredients and recipe information needed after a choice is made. Separating discovery from detail keeps the grid fast to read and prevents every card from becoming a small terms-and-conditions page.

RecipeNest interface
03

Favorites Cross the Search Boundary

Search results are temporary, but meal ideas often are not. Favorites provide a stable collection outside the current query, while theme switching and responsive layouts keep that collection practical across devices. It is a small feature boundary, but it changes the app from a search demo into something a user can return to.

04

Small App, Complete Flow

The deployed app covers the full path from ingredient search through filtered results, saved favorites, and recipe details. The architectural lesson was modest but useful: external API integration becomes a product only after its data is organised around user decisions rather than mirrored endpoint by endpoint.