FoodPeek: Food Delivery Application

Built with React!!!!!

🚀 FoodPeek is a React based food delivery application.

Hosted on foodpeeek.vercel.app, this application brings a hassle-free way to explore and order from restaurants.

Docs

• Example
• Features
• Future Enhancements
• Tech Stack
• Live Demo
• Project Local Setup
• Contributing
• License

Example

🌟 Features

✅ Real-Time API Integration

• Live Swiggy APIs for accurate menus, availability, and promotions.
• Graceful sample-data fallback — if the live API is unavailable or returns nothing, the app shows a rich sample dataset (100+ restaurants and a full sample menu) behind a clear notice, so the UI never breaks.

⚡ Optimized Performance

• Lazy Loading & Code Splitting to enhance loading times and responsiveness.
• Shimmer UI for smooth loading effects.
• Installable PWA with offline-aware online/offline status.

🔧 Efficient State Management

• SWR for data fetching, caching, and request deduplication.
• React Context + useReducer for the shopping cart (persisted to localStorage).
• Custom Hooks to improve code reusability and maintainability.

🛒 Cart & Ordering

• Add-to-cart with quantity steppers across the menu, a live floating order bar, and a header cart badge.
• Full cart page with itemised bill (item total, delivery, taxes), place-order flow, and empty/placed states.

🔍 Advanced Search & Filtering

• Search Functionality to quickly find restaurants and dishes.
• Filtering Options based on cuisine, ratings, and offers.

🚀 Smooth User Experience

• React Router for seamless navigation.
• Redesigned restaurant menu with a gradient hero, sticky category navigation, and modern dish cards.
• 404 Error Page for handling navigation issues gracefully.
• Completely Responsive design for an optimal experience on any device.

🎯 Future Enhancements

• 🌐 Multi-Language Support: Navigate in your preferred language.
• 🌙 Dark Mode: A sleek, user-friendly dark theme.
• 📍 Location-Based Personalization: Custom delivery location setup.
• 💳 Real Checkout & Payments: A backend with secure transactions and order tracking.
• 🔐 User Authentication: Login/Sign-in with personalized services.

💻 Tech Stack

• Framework: React 19
• Data Fetching: SWR
• Routing: React Router
• Styling: Tailwind CSS v4
• Bundler: Vite
• PWA & SEO: vite-plugin-pwa
• Hosting: Vercel

🚀 Live Demo

Visit FoodPeek Live

📂 Project Local Setup

1. Clone the Repository

git clone https://github.com/droidbg/FoodPeek.git
cd FoodPeek

2. Start React App

cd client
npm install
npm start

3. Set Up Environment Variables

Create a .env file in the client directory and add the following variables:

# CORS proxy key (https://cors.sh)
VITE_API_KEY=your_cors_key_here

📜 Contributing

We welcome contributions! Feel free to open issues and pull requests.

📝 License

This project is licensed under the MIT License.

Enjoy fast, seamless food and grocery delivery with FoodPeek!! 🚀