🍔 Restaurant E-Menu Application (React UI)

A modern, responsive, and beautiful frontend interface for the Restaurant E-Menu API. This project was built to demonstrate a premium user experience similar to popular food delivery apps like UberEats or DoorDash.

📸 Screenshots

✨ Features

• Dynamic Menu Rendering: Fetches real-time data from the backend API.
• Category Filtering: Smooth horizontal scroll navigation to filter items by category (Appetizers, Mains, etc.).
• Live Search: Instant search functionality to find foods by name.
• Dietary Indicators: Visual badges for Vegetarian options and Spice levels 🌶️.
• Responsive Design: Fully optimized for Mobile, Tablet, and Desktop screens.
• Modern UI/UX: Built with Tailwind CSS for a clean, glass-morphism aesthetic.

🛠️ Tech Stack

• Framework: React.js (Vite)
• Styling: Tailwind CSS
• Icons: Lucide React
• HTTP Client: Axios
• State Management: React Hooks (useState, useEffect)

🚀 Getting Started

To run this project, you need to have the backend server running first.

Prerequisites

1. Node.js (v14 or higher) installed.
2. The Backend API: You must clone and run the original backend server.

Step 1: Start the Backend Server

This frontend relies on the json-server from the original repository.

# Clone the backend repository (if you haven't already)
git clone [https://github.com/ManeshEdirisinghe/Restaurant-E-Menu-Application.git](https://github.com/ManeshEdirisinghe/Restaurant-E-Menu-Application.git)

# Go to the backend folder
cd Restaurant-E-Menu-Application

# Install dependencies
npm install

# Start the API server (runs on port 3001)
npm run api