Skip to content

soumojit622/recipe-app

Repository files navigation

🍲 Recipe Search App

Logo

📚 Table of Contents

📖 Introduction

Recipe Search App is a modern and responsive web application that allows users to search for recipes. It is built using Vite and React, styled with Tailwind CSS, and utilizes UI components from Daisy UI. The recipe data is fetched from the Edamam API.

✨ Features

  • 📱 Responsive design
  • 🔍 Search for recipes by keywords
  • 📋 View detailed recipe information
  • 🧹 Easy to use and clean UI

🌐 Demo

You can view a live demo of the app here.

🛠️ Technologies Used

  • Vite: ⚡ Next Generation Frontend Tooling
  • React: ⚛️ A JavaScript library for building user interfaces
  • Tailwind CSS: 🎨 A utility-first CSS framework
  • Daisy UI: 🌼 A set of beautiful UI components
  • Edamam API: 🍴 Recipe search API
  • Vercel: 🚀 Deployment platform

🚀 Getting Started

📋 Prerequisites

Make sure you have the following installed:

  • Node.js (v14 or higher)
  • npm (v6 or higher) or yarn

💾 Installation

  1. Clone the repository:

    git clone https://github.com/your-username/recipe-search-app.git
    cd recipe-search-app
  2. Install the dependencies:

    npm install
    # or
    yarn install

🏃‍♂️ Running the App

  1. Create a .env file in the root directory and add your Edamam API credentials:

    VITE_APP_ID=your_edamam_app_id
    VITE_APP_KEY=your_edamam_app_key
  2. Start the development server:

    npm run dev
    # or
    yarn dev
  3. Open your browser and navigate to http://localhost:3000.

🔗 API Integration

The app uses the Edamam Recipe Search API to fetch recipe data. To learn more about the API, visit the Edamam API documentation.

🙏 Acknowledgements