https://github.com/sahithyabeesu03/food_recipe

App allows users to search for recipes and view detailed information using the MealDB API.The app features a responsive design and JavaScript for dynamic content loading and user interactions
https://github.com/sahithyabeesu03/food_recipe

api html5 javascript mealdb-api media-queries

Last synced: 11 days ago
JSON representation

App allows users to search for recipes and view detailed information using the MealDB API.The app features a responsive design and JavaScript for dynamic content loading and user interactions

• Host: GitHub
• URL: https://github.com/sahithyabeesu03/food_recipe
• Owner: sahithyabeesu03
• Created: 2024-11-03T06:23:08.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-11-03T06:53:13.000Z (3 months ago)
• Last Synced: 2024-11-12T15:26:38.149Z (2 months ago)
• Topics: api, html5, javascript, mealdb-api, media-queries
• Language: CSS
• Homepage: https://sahithyabeesu03.github.io/Food_Recipe/
• Size: 22.5 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
I developed a food recipe web application that allows users to search for recipes, view detailed information, and get a

list of ingredients and cooking instructions. The app uses HTML, CSS, and JavaScript, and fetches data from TheMealDB

API. Key features include an intuitive search interface, dynamic content rendering, and a responsive design. I

implemented asynchronous data fetching and error handling to ensure a smooth user experience. This project enhanced

my skills in working wuth third party apis, creatingresponsive design. Future improvements could include user

authentication and advanced search filters.

Technology Stack:

HTML: Used for structuring the web page and its elements.

CSS: Applied for styling the web page to make it visually appealing and responsive.

JavaScript: Implemented to handle user interactions and dynamically fetch and display recipe data.

TheMealDB API: Used for fetching recipe data based on user queries.

Key Features:

 Asynchronous Data Fetching: Utilized JavaScript's fetch API to make asynchronous requests to TheMealDB

API, ensuring a smooth user experience without page reloads.

 Dynamic Content Rendering: Used DOM manipulation to dynamically create and insert recipe elements based

on the fetched data.

 Responsive Design: Ensured the app is mobile-friendly by using CSS media queries and a flexible grid layout.

 Error Handling: Implemented basic error handling to inform users if there was an issue fetching recipes