https://inspiring-sundae-2d353c.netlify.app/
Overview:
This project was created as part of Technigo’s Web Development Bootcamp, during the module focused on APIs, JSON, fetch() and Promises. The goal was to replace static mock data with real recipe data from the Spoonacular API and build a dynamic, responsive recipe library.
Objectives:
- Understand what an API is and how to work with external data
- Use fetch() to retrieve JSON data
- Handle asynchronous code using Promises
- Update the UI dynamically based on API responses
- Adjust filtering & sorting to match real API data
- Manage API limitations and edge cases
What I Built:
- Fetched real recipe data from Spoonacular API
- Displayed dynamically generated recipe cards
- Implemented filtering and sorting based on the API’s data structure
- Added error handling for daily API quota limits
- Improved the UI to react to loading, errors, and missing data
Stretch Features: These were suggested extras for increased functionality:
- Combined filters (e.g., vegetarian + popular recipes)
- LocalStorage caching to reduce API calls
- Loading indicators while fetching
- Search functionality (by recipe name or ingredients)
Technologies Used:
- HTML
- CSS
- JavaScript (fetch, Promises, DOM manipulation)
- External API: Spoonacular