Simple Recipe UI

This React application provides a user-friendly interface to search for recipes from the MealDB API. Users can enter a search term, and the app will retrieve relevant recipes with ingredients and instructions. Error handling is implemented to handle potential issues.

Features:

• Search for recipes by keyword using TheMealDB API
• Display retrieved recipes with title, image
• Navigate to a detailed view of each recipe with full ingredients list and instructions
• Error handling for API requests and search results (e.g., no results found, network errors)

Installation:

1. Clone this repository:

   git clone https://github.com/Ashwin-Ash-09/recipeui

2. Install dependencies:

   cd recipeui
   npm install

Running the App:

1. Start the development server:

   npm start

2. Open http://localhost:3000 (or your chosen port) in your browser.

Usage:

1. Enter a search term in the input field.
2. Click the "Search" button or press Enter.
3. The app will display a list of matching recipes.
4. Click on a recipe to view its details, including ingredients and instructions.

Error Handling:

• The app handles potential errors during API requests and search results.
• In case of network errors or empty results, user-friendly messages will be displayed.

Tech Stack:

• React
• Axios (for API requests)
• HTML
• CSS
• JavaScript

I hope this comprehensive README file provides a clear and helpful guide for users of your Simple Revipe UI!