https://meal-finder-api-jed.netlify.app/
This is a simple program where you can search for a meal keyword and get few recipies.
Also if you don't know what to search for , you can hit random button and get a single random meal from the API.
It displays the cooking instructions and the ingerdients for each searched meal.
This was the first time attempting to work with APIs. I decided to make this project for my personal use. There was some nights where I was wondering what to eat or cook so it occured to me why don't I make my own website where I can search for a meal and that is how MealFinder was born. I know that I could search the web for a similar site and not bother developing it but where is the fun in that!
The main purpose of MealFinder was for personal use, so making it pretty was not a priority back then.
- Random button to get a random meal
- Search for your favourite meal and get the cooking instructions and ingredients
- Finding the right API was a bit of a challenge. A lot of free APIs allow limited requests until I stumbled upon an awesome API called the_meal_db_API. It was relatively easy to use and the data is sufficient for such a proejct.
- Manipulating API data was a new skill so I had to read a lot of documentations and watch Youtube tutorials.
- Displaying API data. Another issue I faced was how to display API data as a grid. It took some time to get my head around how HTML, CSS and JS need to work together to produce the desired result.
- Improve the user interface
- Allow users to mark their favourite meals for future reference
- Use reactJs instead of vanilla JS for scalability and sustainability
- Enhance multiple devices responsiveness