A full-stack Food Delivery Web Application built using modern web technologies. This application allows users to browse restaurants, view detailed restaurant menus, add items to a cart, and proceed with checkout. The system also supports user authentication, including email verification, and is equipped with an administrative dashboard.....
BSD-3-CLAUSE License
Welcome to the MERN (MongoDB, Express.js, React.js, Node.js) stack project! This comprehensive guide will walk you through every aspect of this project, including its structure, setup instructions, usage, API endpoints, backend, frontend, contributing guidelines, license information, and how to get in touch for support or inquiries.
A full-stack Food Delivery Web Application built using modern web technologies. This application allows users to browse restaurants, view detailed restaurant menus, add items to a cart, and proceed with checkout. The system also supports user authentication, including email verification, and is equipped with an administrative dashboard to manage restaurant details, menus, and customer orders.
This project is perfect for building a scalable and modular food delivery platform that includes features for users, restaurant owners, and administrators.
You can try out the live demo of the app here.
public
index.html
favicon.ico
assets
images
src
auth
Login.tsx
Signup.tsx
ForgotPassword.tsx
ResetPassword.tsx
admin
AddMenu.tsx
Orders.tsx
Restaurant.tsx
components
Cart.tsx
HereSection.tsx
Loading.tsx
Profile.tsx
RestaurantDetail.tsx
SearchPage.tsx
Success.tsx
ui
button.tsx
dialog.tsx
input.tsx
separator.tsx
layout
MainLayout.tsx
store
useUserStore.ts
useCartStore.ts
useOrderStore.ts
useThemeStore.ts
types
cartType.ts
orderType.ts
App.tsx
main.tsx
index.css
backend
config
db.js
jwt.js
controllers
authController.js
orderController.js
restaurantController.js
menuController.js
middlewares
authMiddleware.js
errorHandler.js
models
userModel.js
orderModel.js
restaurantModel.js
menuModel.js
routes
authRoutes.js
orderRoutes.js
restaurantRoutes.js
menuRoutes.js
utils
generateToken.js
emailSender.js
server.js
.env
.gitignore
package.json
README.md
nodemon.json
.env
.gitignore
package.json
postcss.config.js
tailwind.config.js
tsconfig.json
vite.config.ts
README.md
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.
Before running the project, ensure you have the following installed:
Clone the repository:
git clone https://github.com/nishkarsh25/BreadcrumbsVITE-SHADCN-MERN-ZOD-ZUSTAND-RestaurantWebsite.git
Navigate to the project branch:
git checkout <branch-name>
Replace <branch-name>
with the name of the branch you want to checkout.
Start the Backend Server: Launch the backend Node.js server.
cd backend
node index.ts
Start the Frontend Development Server: Run the React development server for the frontend application.
cd frontend
npm run dev
Run the development server:
cd client
npm start
Open your browser and navigate to http://localhost:5173 to view the app.
Heres a detailed How to Use section containing features of the app and an Endpoints section in Markdown code for your README file:
User Registration and Login
Browsing Restaurants
Managing the Cart
Placing an Order
User Profile Management
Admin Functionality
Additional Features
Here is a list of the major API endpoints used by the application. These endpoints interact with the backend (if applicable) to handle user authentication, restaurant management, and orders.
POST /api/auth/signup
{
"fullname": "John Doe",
"email": "[email protected]",
"password": "password123",
"contact": "9876543210",
"address": "123 Main St",
"city": "Hyderabad",
"country": "India"
}
POST /api/auth/login
{
"email": "[email protected]",
"password": "password123"
}
POST /api/auth/forgot-password
{
"email": "[email protected]"
}
POST /api/auth/reset-password
{
"token": "resetToken",
"newPassword": "newPassword123"
}
GET /api/user/profile
{
"fullname": "John Doe",
"email": "[email protected]",
"contact": "9876543210",
"address": "123 Main St",
"city": "Hyderabad",
"country": "India"
}
PUT /api/user/profile
{
"fullname": "John Doe",
"contact": "9876543210",
"address": "123 Main St",
"city": "Hyderabad",
"country": "India"
}
GET /api/restaurants
[
{
"id": "restaurant1",
"name": "Restaurant 1",
"location": "Hyderabad",
"rating": 4.5
},
{
"id": "restaurant2",
"name": "Restaurant 2",
"location": "Bangalore",
"rating": 4.0
}
]
GET /api/restaurants/:id
{
"id": "restaurant1",
"name": "Restaurant 1",
"location": "Hyderabad",
"menu": [
{
"id": "menuItem1",
"name": "Pizza",
"price": 250,
"image": "/images/pizza.jpg"
},
{
"id": "menuItem2",
"name": "Burger",
"price": 150,
"image": "/images/burger.jpg"
}
]
}
POST /api/restaurants
{
"name": "Restaurant 3",
"location": "Mumbai",
"menu": []
}
PUT /api/restaurants/:id
{
"name": "Updated Restaurant Name",
"location": "Updated Location"
}
DELETE /api/restaurants/:id
POST /api/cart
{
"menuId": "menuItem1",
"quantity": 2
}
GET /api/cart
[
{
"menuId": "menuItem1",
"name": "Pizza",
"quantity": 2,
"price": 250
}
]
POST /api/orders
{
"cartItems": [
{
"menuId": "menuItem1",
"quantity": 2
}
],
"deliveryDetails": {
"address": "123 Main St",
"city": "Hyderabad",
"contact": "9876543210"
}
}
GET /api/orders
[
{
"orderId": "order1",
"cartItems": [
{
"menuId": "menuItem1",
"name": "Pizza",
"quantity": 2,
"price": 250
}
],
"status": "Confirmed"
}
]
Contributions to this project are highly appreciated! Whether you discover bugs, have feature requests, or wish to contribute improvements, your input is valuable. Here's how you can contribute:
Report Issues: If you encounter any bugs or issues while using MyCalculatorApp, please open an issue on the GitHub repository. Be sure to provide detailed information about the problem and steps to reproduce it.
Submit Pull Requests: If you have enhancements or fixes to propose, feel free to submit a pull request. Contributions that improve the functionality, usability, or performance of this app are welcomed and encouraged.
Contributions are welcome! If you'd like to contribute to this project, please follow these steps:
git checkout -b feature/your-feature-name
).git commit -am 'Add some feature'
).git push origin feature/your-feature-name
).This project is licensed under the The 3-Clause BSD License.Feel free to explore, modify, and contribute to this project as you see fit. Your feedback and contributions are greatly appreciated!
This project is made possible by the contributions and support of various individuals and communities. Special thanks to:
This project wouldn't be possible without the contributions of the following:
React: A JavaScript library for building user interfaces. Visit React for more information.
Vite: A fast build tool that serves your code via native ESM. Visit Vite for more information.
Shadcn UI: A component library providing a set of highly customizable UI components built for React. Visit Shadcn UI for more information.
Tailwind CSS: A utility-first CSS framework for creating custom designs rapidly. Visit Tailwind CSS for more information.
React Router: React Router is a library for routing in React applications, allowing for navigation between different components. Visit React Router for more information.
Zustand: A small, fast, and scalable state management solution for React, providing a lightweight alternative to Redux. Visit Zustand for more information.
Zod: A TypeScript-first schema declaration and validation library, used for validating and parsing structured data. Visit Zod for more information.
Axios: Axios is a promise-based HTTP client for making asynchronous requests in JavaScript applications. Visit Axios for more information.
Express: Express is a minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications. Visit Express for more information.
Mongoose: Mongoose is an Object Data Modeling (ODM) library for MongoDB and Node.js, providing a straightforward schema-based solution for modeling application data. Visit Mongoose for more information.
JSON Web Token (JWT): JSON Web Token is a compact, URL-safe means of representing claims to be transferred between two parties. It is commonly used for authentication and authorization in web applications. Visit JWT for more information.
Netlify: Netlify provides seamless deployment and hosting solutions, making it easy to deploy web applications and share them with the world. Visit Netlify for more information.
Render: Render offers a modern cloud platform for deploying and running web applications, databases, and other services. Visit Render for more information.
MongoDB Atlas: MongoDB Atlas is a fully managed cloud database service for modern applications. Visit MongoDB Atlas for more information.