🍽️ Meal Explorer

🔗 Live Demo: https://dk-meal-explorer.netlify.app/

Meal Explorer is a dynamic and responsive React application that allows users to discover, search, and save their favorite recipes. Built with Vite and React Router, it seamlessly integrates with TheMealDB API to provide an extensive catalog of meals.

✨ Features

• Search Meals: Quickly search for your favorite meals by name.
• Detailed Recipes: View comprehensive meal details, including ingredients, step-by-step instructions, and high-quality images.
• Categorized Browsing: Filter and explore meals by various categories like Seafood, Dessert, Vegetarian, etc.
• Favorites System: "Like" your favorite meals to save them in a dedicated collection. (Your preferences are persisted locally using your browser's Local Storage).
• Responsive Navigation: A smooth, app-like routing experience powered by React Router.

🛠️ Tech Stack

• Frontend: React 19, React Router DOM v7
• Build Tool: Vite
• Styling & Assets: Vanilla CSS, React Icons
• Data Source: TheMealDB

🚀 Getting Started

Follow these steps to set up the project locally on your machine.

Prerequisites

• Node.js (v16 or higher recommended)
• npm or yarn

Installation

1. Navigate to the project directory:

   cd Meal_Explorer

2. Install the dependencies:

   npm install

3. Start the development server:

   npm run dev

4. Open the app: Open your browser and navigate to the local URL provided in your terminal (usually http://localhost:5173).

📂 Project Structure

• src/components/ - Reusable UI components like the Navbar.
• src/pages/ - Core page views corresponding to routes (Home, MealDetails, Categories, LikedMeals).
• src/utils/ - Helper functions containing logic for managing "liked" meals in local storage.

🤝 Contributing

Feel free to fork the project and submit pull requests if you have ideas for new features or improvements!