A web application that randomly generates meal recipes based on user-selected food categories. The app fetches data from TheMealDB API to provide users with diverse recipe options.
- Category Selection: Choose from 12 different meal categories including Beef, Chicken, Dessert, Lamb, Pasta, Pork, Seafood, Side, Starter, Vegan, Vegetarian, and Breakfast
- Random Recipe Generation: Get a random recipe from your selected category
- Detailed Recipe Information: View recipe title, image, country of origin, ingredients with measurements, and full instructions
- Source Links: Direct links to the original recipe sources for further information
- HTML5
- CSS3 (with responsive design)
- JavaScript (Vanilla)
- TheMealDB API
- The app connects to TheMealDB's API to fetch available recipes by category
- When a user selects a category, the app:
- Fetches all meals in that category
- Randomly selects one meal from the results
- Fetches detailed information about the selected meal
- Displays the recipe with all relevant information
- Users can select a different category at any time to get a new random recipe
- Clone the repository:
git clone https://github.com/Andreawingardh/What-s-for-dinner.git - Navigate to the project directory:
cd What-s-for-dinner - Open
index.htmlin your web browser
- Open the app in your web browser
- Click on the "Choose your category" dropdown
- Select a meal category from the dropdown menu
- View the randomly generated recipe with ingredients and cooking instructions
- Click on the recipe title to visit the original recipe source
- Select another category to generate a new random recipe
This project uses TheMealDB API, a free meal recipe database. The app makes use of the following endpoints:
- Filter by category:
https://www.themealdb.com/api/json/v1/1/filter.php?c={category} - Look up meal details:
https://www.themealdb.com/api/json/v1/1/lookup.php?i={mealId}
This project is licensed under the MIT License.
- TheMealDB for providing the free API
Andrea Wingårdh - GitHub Profile