A fully responsive, dynamic food ordering website built with React.js. Users can browse meals, search/filter dishes, manage their cart, and enjoy light/dark mode โ all wrapped in a modern, mobile-friendly UI.
- โ Add to Cart โ Add any item to your cart with one click.
- โโ Adjust Quantity โ Increase or decrease item quantity inside the cart.
- โ Remove Items โ Easily remove unwanted items from the cart.
- ๐ Cart Summary โ View the total and see your selected items.
- ๐ Search & Filter โ Instantly find your favorite food items.
- ๐ Dark/Light Mode โ Toggle between themes (stored in localStorage).
- ๐ฑ Responsive Sidebar โ Optimized for mobile with smooth sidebar UX.
- โ๏ธ Context API โ Lightweight global state management.
- ๐จ Vanilla CSS โ Clean and efficient styling, no frameworks.
- ๐ญ React Icons โ Polished UI with meaningful icons.
- ๐ค Google Font (Outfit) โ Sleek, modern typography.
| Tech | Usage |
|---|---|
| React.js | Core frontend framework |
| Context API | State management |
| Vanilla CSS | Custom styling |
| React Icons | Icon library |
| Google Fonts | For beautiful typography |
| LocalStorage | Persist theme preference (light/dark) |
Clone this repo and run it locally:
git clone https://github.com/NomanKhial/-restaurant-react-js-app.git
npm install
npm run devIntegrate backend (e.g., Firebase / Express)
Implement payment gateway
Show order history
Add animations with Framer Motion
๐งโ๐ป Author Noman โ Computer Science Student & Full Stack Dev Connect with me on LinkedIn | Portfolio -> Comming Soon
๐ License