PROJECT REPORT ON

FOOD DELIVERY WEB PORTAL

In partial fulfilment of the requirement for the award of the

Diploma of Computer Engineering

Submitted by:

Ashish Kumar Aryan Amit

210040800020 210040800016 210040800009

Department of Computer Engineering

Government Polytechnic Hisar-125001
August, 2023

i
 DECLARATION

We hereby declare that the Industrial Training Report entitled "IPL data analysis" is an authentic
record of work carried out by us during our training at "Solitaire Infosys" under the supervision of
our training supervisor Mr. Nitin Arora for the award of diploma of Computer Engineering

Lokesh and Ankur

210040800054 and 210040800014

Date:

(Signature of Head of Department)

Examined by:

ii
 ACKNOWLEDGEMENT

It gives me immense pleasure to express my deepest sense of diploma and sincere thanks to my
highly respected and esteemed project guide Mr. Nitin Arora for his valuable guidance,
encouragement, and help for completing this work. His useful suggestions for this whole work and
cooperative behaviour are sincerely acknowledged.

I am also grateful to my teachers for their constant support and guidance. I also wish to express my
indebtedness to my parents as well as my family member whose blessings and support always helped
me to face the challenges ahead. At the end, I would like to express my sincere thanks to all my
friends and others who helped me directly or indirectly during this project work.

Lokesh and Ankur

210040800054 and 210040800014

iii
 ABSTRACT
Our project aims to develop a comprehensive food delivery web portal that revolutionizes the culinary
experience for both customers and restaurants. In today's fast-paced world, convenience is key, and our
platform seeks to seamlessly connect hungry patrons with a diverse array of culinary options while
empowering local eateries to expand their reach and grow their businesses. At the heart of our web
portal is user-centric design, prioritizing ease of use and accessibility. Customers will enjoy a
streamlined browsing experience, with intuitive search functionalities and personalized
recommendations based on their preferences and past orders. From cozy neighbourhood cafes to
upscale dining establishments, our platform will feature a wide range of culinary offerings to cater to
every taste and occasion.

For restaurants, our portal offers a powerful suite of tools to manage orders, menus, and customer
interactions efficiently. Through a user-friendly dashboard, restaurant owners can update their menus in
real-time, track orders seamlessly, and gather valuable insights into customer behaviour to optimize
their offerings and marketing strategies. In addition to convenience and efficiency, our project
prioritizes transparency and trust. Customers will have access to detailed information about each
restaurant, including reviews, ratings, and hygiene ratings, enabling them to make informed decisions.
We are committed to fostering a vibrant community of food enthusiasts who can share their
experiences and recommendations, enriching the dining landscape for all.

Moreover, our platform will prioritize sustainability by partnering with eco-conscious restaurants and
offering options for reusable packaging and carbon-neutral delivery services. By harnessing technology
for good, we aim to minimize the environmental footprint of food delivery and contribute to building a
more sustainable future. In conclusion, our food delivery web portal represents more than just a
convenient way to order food—it's a catalyst for culinary exploration, community building, and
sustainable dining practices. With a focus on user experience, restaurant empowerment, and
environmental responsibility, we envision a future where everyone can enjoy delicious meals with ease,
while supporting local businesses and preserving the planet.

iv
 Index

DECLARATION…………………….....……………………..…………………ii

ACKNOWLEDGEMENT………………..……………….……..…..………….iii

ABSTRACT………………………………………………………..….…………iv

CHAPTER 1: INTRODUCTION……………...…………….....…..…………..6

CHAPTER 2: PROJECT DESCRIPTION……..……….……………………..9

CHAPTER 3: SYSTEM SPECIFICATION.………….……….……..…….....12

CHAPTER 4: CODE…………….…………………...…….…………………...14

CHAPTER 5: PROJECT OUTPUT……………..…………………………….41

CHAPTER 6: CONCLUSION…………………………………………………47

CHAPTER 7: FUTURE SCOPE.…………………….………………………..48

BIBLIOGRAPHY………………………………………………………………49

v
 CHAPTER 1: INTRODUCTION
1.1 Introduction of Food Delivery Web portal:
Our food delivery website project aims to transform the way people experience dining by providing a
seamless and convenient platform for ordering delicious meals from a variety of restaurants. In today's
fast-paced society, where time is often limited and convenience is paramount, our website seeks to
bridge the gap between hungry customers and their favorite eateries.

With an emphasis on user-friendly design and accessibility, our platform will offer a hassle-free
ordering process, personalized recommendations, and a diverse selection of culinary options to suit
every palate and occasion. By leveraging the power of technology, we aspire to not only simplify the
dining experience but also foster a sense of community and connection among food enthusiasts.

Through this project, we hope to revolutionize the food delivery industry, empowering both customers
and restaurants to enjoy the benefits of seamless transactions, while also promoting local businesses
and culinary diversity.

1.2 Objective:
When creating a food delivery app, your main objectives typically revolve around providing a
seamless and convenient experience for both customers and restaurant partners. Here are some key
objectives:
1. User Experience (UX) Optimization: Ensure the app is intuitive, easy to navigate, and
visually appealing. Users should be able to quickly find what they're looking for and place
orders without any hassle.
2. Efficient Ordering Process: Streamline the ordering process to minimize the number of steps
required for users to place an order. Incorporate features like saved addresses, favourite orders,
and quick reordering to enhance convenience.
3. Wide Restaurant Selection: Partner with a diverse range of restaurants to offer users a wide
selection of cuisines and dining options. Ensure that the app provides detailed information
about each restaurant, including menus, prices, reviews, and ratings.
4. Accurate Order Tracking: Implement real-time order tracking functionality so users can
monitor the status of their orders from placement to delivery. Provide estimated delivery times
and notifications to keep users informed throughout the process.
5. Secure Payment Options: Offer multiple secure payment options, including credit/debit
cards, mobile wallets, and cash on delivery. Ensure that users' payment information is
protected using encryption and other security measures.
6. Quality Assurance: Maintain high standards of food quality and delivery service by
establishing clear guidelines and standards for restaurant partners. Regularly monitor feedback
and ratings to identify areas for improvement.

6
 7. Customer Support: Provide responsive customer support through various channels, such as
in-app chat, email, and phone support. Address user inquiries, complaints, and issues promptly
to ensure a positive overall experience.
8. Promotions and Loyalty Programs: Implement promotional offers, discounts, and loyalty
programs to incentivize repeat orders and encourage user engagement. Personalize promotions
based on user preferences and order history.
9. Seamless Integration: Integrate the app with other platforms and services, such as
mapping and navigation apps for accurate delivery routing, as well as social media platforms
for easy sharing and promotion.
10. Continuous Improvement: Regularly gather user feedback and data analytics to identify areas
for improvement and new features to implement. Stay updated with emerging technologies and
industry trends to remain competitive in the market.

1.3 Features:
The food delivery website project will incorporate a range of features to enhance the user experience
and streamline the ordering process. Some key features include:

1. User-friendly Interface: A clean and intuitive interface that allows users to easily browse
restaurants, view menus, and place orders with minimal effort.
2. Search and Filter Options: Robust search and filter functionalities to help users find specific
cuisines, dishes, or restaurants based on preferences such as location, price range, and dietary
restrictions.
3. Personalized Recommendations: Utilizing data analytics and machine learning algorithms to
provide personalized recommendations based on past orders, user preferences, and trending
dishes.
4. Order Tracking: Real-time order tracking functionality that enables users to monitor the status
of their orders from preparation to delivery, ensuring transparency and peace of mind.
5. Secure Payment Gateway: Integration with secure payment gateways to facilitate seamless
and secure transactions, including support for various payment methods such as credit/debit
cards, digital wallets, and cash on delivery.
6. Restaurant Management Dashboard: A comprehensive dashboard for restaurant
owners/managers to manage menus, track orders, monitor sales data, and respond to customer
feedback efficiently.
7. Customer Reviews and Ratings: The ability for users to leave reviews and ratings for
restaurants and dishes, helping other users make informed decisions and fostering a sense of
community feedback.
8. Promotions and Discounts: Integration of promotional offers, discounts, and loyalty programs
to incentivize users to order regularly and engage with the platform.
9. Responsive Design: A mobile-responsive design to ensure seamless access and functionality
across various devices, including smartphones, tablets, and desktops.

7
 10. Customer Support: Dedicated customer support channels, including live chat, email, and
phone support, to assist users with any queries or issues they may encounter during the ordering
process.

By incorporating these features, the food delivery website project aims to provide a comprehensive and
user-centric platform that caters to the needs and preferences of both customers and restaurants,
ultimately enhancing the overall food delivery experience.

1.4 Technologies used:

1. HTML: HTML, or Hypertext Markup Language, is the standard language used to create and
design web pages. It provides the structure and framework for organizing content on the
internet.
2. CSS:CSS, or Cascading Style Sheets, is a fundamental technology used in web development to
control the presentation and appearance of HTML elements on a web page. While HTML
provides the structure and content of a webpage, CSS defines how that content is styled,
including aspects such as layout, colors, fonts, and spacing.
3. JavaScript: JavaScript, often abbreviated as JS, is a versatile programming language primarily
used for enhancing interactivity and functionality on web pages. Unlike HTML and CSS, which
focus on structure and presentation respectively, JavaScript enables dynamic behavior, allowing
web pages to respond to user actions, manipulate content, and communicate with servers.
4. JSON: JSON (JavaScript Object Notation) is a lightweight data interchange format commonly
used for transmitting data between a web server and a client. It is human-readable, easy to
parse, and closely resembles JavaScript objects, making it a popular choice for data exchange in
web development.
5. Bootstrap: Bootstrap is a front-end framework for developing responsive and mobile-first
websites and web applications. Originally developed by Twitter, Bootstrap has become
immensely popular due to its ease of use and extensive pre-built components.
6. React.js: React.js, commonly known as React, is a popular JavaScript library for building user
interfaces, developed by Facebook. It's renowned for its efficiency, flexibility, and ability to
create interactive and dynamic web applications.
7. Node.js: Node.js is a powerful JavaScript runtime built on Chrome's V8 JavaScript engine. It
allows developers to run JavaScript code on the server-side, enabling the development of
scalable and high-performance network applications.

The combination of these technologies ensures a user-friendly experience and efficient communication
in the digital age.

8
 CHAPTER 2: PROJECT DESCRIPTION
2.1 NEED FOR THE THIS PROJECT:
Creating a food delivery website requires careful planning and implementation to ensure it meets the
needs of both customers and restaurant partners. Here are the essential features and steps to develop a
comprehensive and functional food delivery website.

2.2 SYSTEM STUDY AND ANALYSIS:

2.2.1Existing System:
An existing food delivery website system typically consists of several integrated components that work
together to provide a seamless user experience. Here’s an overview of the main components and
functionalities:
The existing system of this website comprises the current design, layout, content, and functionality. It
may include the trendy visual style, the way you presenting luxury and experiences, and the technology
or platform used to host the website. This includes any strengths or weaknesses in the presentation of
your work, user navigation, and overall user experience. Evaluating the existing system is crucial as it
provides the foundation for identifying areas of improvement, ensuring that our website effectively
communicates your abilities and accomplishments to our target audience.
Designing the structure and layout of a food delivery website involves several key components to
ensure a seamless user experience. Here's a breakdown:
2.2.2 Structure and Layout
Home Page
The homepage serves as the entry point, featuring prominent sections for showcasing featured
restaurants, popular dishes, and special offers. It typically includes a search bar for users to quickly find
restaurants or specific dishes, along with categories like cuisine types, dietary preferences, and meal
types for easy navigation.

Restaurant Listing
Upon searching or browsing, users are presented with a list or grid view of restaurant listings. These
listings display essential details such as restaurant name, cuisine, rating, and estimated delivery time.
Users can further refine their search using filters based on cuisine, price, ratings, etc., and sort the
results by relevance, ratings, or delivery time.
Restaurant Page
Clicking on a restaurant leads users to its dedicated restaurant page, where they find detailed
information such as menu items, prices, opening hours, location, and high-quality images of the
restaurant and its dishes. Additionally, users can read reviews and ratings from other customers to help
them make informed decisions. Each restaurant page includes a prominent button to directly place an
order, streamlining the ordering process.
Menu Pages
The menu pages present the restaurant's menu in an organized manner, with clear categories like
appetizers, main courses, and desserts. Each dish is accompanied by images, descriptions, and prices,
allowing users to make informed choices. They can also customize their orders, selecting toppings or
specifying portion sizes. Any available deals or discounts are highlighted to encourage purchases.
User Account Management
User account management is facilitated through user profile functionality, enabling users to sign up,
log in, and manage their profiles. They can save favorite restaurants, view previous orders, and store
delivery addresses for quicker checkout in the future. Order tracking features allow users to monitor the
status of their orders in real-time, providing estimated delivery times and updates if there are any
delays.
Checkout Process
The checkout process guides users through a seamless journey, collecting necessary information for
delivery, such as address and contact details. Multiple payment options are offered, including
credit/debit cards and digital wallets, ensuring convenience and security. Users receive confirmation
emails or notifications after successful orders, providing reassurance and order details.
Order Tracking
The order tracking feature provides customers with real-time updates on the status of their orders. This
includes information such as whether the order has been received, is being prepared, is out for delivery,
or has been delivered. Additionally, it offers estimated delivery times and notifies users of any delays.
If customers have any concerns or inquiries regarding their orders, they can easily contact support
through the website.
Responsive Design
A responsive design ensures that the website is accessible and user-friendly across various devices,
including smartphones and tablets. This involves optimizing the layout and functionality to
accommodate different screen sizes and resolutions. By adapting to the device being used, the website
provides a seamless experience for users, regardless of the device they are accessing it from.

Additional Features
In addition to core functionalities, the website may offer extra features to enhance user experience and
engagement. This could include implementing a referral program or loyalty rewards system to
encourage repeat orders and customer loyalty. Furthermore, offering customer support through live
chat, FAQs, or contact forms provides users with assistance whenever needed. Integrating social media
sharing options enables users to easily share their orders or experiences with friends and followers,
increasing brand visibility and potentially attracting new customers.

10
The food delivery project aims to create an efficient, user-friendly platform that connects local
restaurants with customers who desire convenient, quick access to their favorite meals. By leveraging a
mobile app and a web-based interface, the project seeks to streamline the process of browsing menus,
placing orders, and tracking deliveries in real-time. The platform will integrate features such as
customizable meal options, various payment methods, and customer reviews, ensuring a seamless
experience from ordering to delivery. This initiative not only caters to the needs of busy individuals and
families but also supports local businesses by expanding their customer reach and optimizing their
delivery operations.

11
 CHAPTER 3: SYSTEM SPECIFICATION HARDWARE

3.1 Software Requirements:

1. Operating System : Windows 11/2020 or Linux

2. User Interface : HTML, CSS
3. Client-side Scripting : JavaScript
4. Programming Language : Java and React Js
5. Output Deployment : WhatsApp web

3.2 Technology Used:

1. CSS
2. Bootstrap
3. JavaScript

4. SQL

5. Json

6. Node Js

3.3 Hardware Requirements:

1. Processor : Intel Core

2. Hard Disk : 20GB or more
3. RAM : 512MB or more

3.4 Package Required:

In a food delivery website project, the system specification and hardware requirements play a crucial
role in ensuring smooth operation, scalability, and security. Here's an overview:

Web Server:
The web server should have sufficient processing power and memory to handle incoming requests,
database operations, and serve web pages efficiently. A server with multi-core processors (e.g., Intel
Xeon), ample RAM (e.g., 16GB+), and SSD storage for faster data access is recommended.
Database Server:

The database server needs to handle a large volume of data related to users, orders, restaurants, menus,
etc. It should be capable of handling concurrent transactions efficiently. Similar to the web server, a
robust database server requires multi-core processors, sufficient RAM (e.g., 32GB+), and fast storage
(SSD) to ensure quick data retrieval.

Load Balancer (Optional for Scalability):

If expecting high traffic, a load balancer distributes incoming traffic across multiple web servers to
improve performance and reliability. Load balancer hardware or software should be capable of
efficiently distributing traffic based on predefined algorithms, such as round-robin or least connections.

Networking:

Reliable networking equipment is essential for ensuring seamless communication between servers,
clients, and external services. High-speed routers, switches, and network interfaces are necessary to
maintain low latency and high throughput.

Security Hardware:

Implementing security measures such as firewalls, intrusion detection/prevention systems (IDS/IPS),

and SSL termination is vital to protect sensitive data and prevent cyber threats. Dedicated security
appliances (e.g., next-generation firewalls) and SSL accelerators can enhance security without
compromising performance.

Backup and Redundancy:

Regular backups and redundancy measures are crucial for data integrity and disaster recovery. Backup
storage devices, redundant power supplies, and RAID configurations ensure data availability and
minimize downtime in case of hardware failures.

Scalability Considerations:

Design the system with scalability in mind to accommodate future growth and fluctuations in traffic.
Invest in modular and scalable hardware solutions that allow easy expansion of resources, such as
adding more servers or upgrading components as needed.

Monitoring and Management:

Implement monitoring tools to track system performance, resource utilization, and security events.
Dedicated monitoring servers or cloud-based services can provide real-time insights into the health and
performance of the infrastructure.

13
 CHAPTER 4: CODE
SERVER CODE:
<!DOCTYPE html>

<html lang="en" dir="ltr">

<head>

<title>OLD RAO</title>

<link

rel="shortcut icon"

href="images/momo-icon.webp"

type="image/x-icon"

/>

<!-- META -->

<meta charset="utf-8" />

<meta

name="viewport"

content="width=device-width, initial-scale=1, shrink-to-fit=no"

/>

<meta

name="OLD RAO"

content="Author: Rishika Garg, Illustrator: Font Awesome and Flat Icon, Category: Food
Application, Open Source: Yes"

/>

<meta name="description" content="Food Ordering Website. The 'MOMOMIA' has

been practiced to override the prevalent problems in manual systems. This

website is compatible to finalize and, in some cases, reduces the

14
 difficulties faced by this existing system.>

<meta name="robots" content="all" />

<meta name="googlebot" content="all" />

<!-- GOOGLE FONTS -->

<link

href="https://fonts.googleapis.com/css2?
family=Marck+Script&family=Ubuntu:wght@400;500;700&display=swap"

rel="stylesheet"

/>

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?

family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0" />

<!-- CDN FONTS -->

<link href="https://fonts.cdnfonts.com/css/elinga" rel="stylesheet" />

<!-- FONTAWESOME -->

<link

rel="stylesheet"

href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css"

integrity="sha256-h20CPZ0QyXlBuAw7A+KluUYx/3pK+c7lYEpqLTlxjYQ="

crossorigin="anonymous"

/>

<!-- BOOTSTRAP -->

<link

rel="stylesheet"
15
 href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"

integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9I
fjh"

crossorigin="anonymous"

/>

<!-- CSS -->

<link href="https://copyfonts.com/fonts/attari-salees.html" />

<link rel="stylesheet" href="./styles.css" />

</head>

<body>

<!-- This is the Loader -->

<div id="loading">

<img

id="loading-image"

src="https://user-images.githubusercontent.com/62802231/194802891-66d7c782-9765-419d-
964b-b6bf6323b95a.gif"

alt="Loading..."

/>

</div>

<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">

<div class="container">

<!-- CODE FOR NAVIGATION BAR -->

<ul class="px-0 mx-0">

16
 <img

src="./images/navbar-logo.gif"

height="100px"

width="100px"

alt="navbar-logo"

/>

</ul>

<a class="navbar-brand" href="index.html">OLD RAO</a>

<button

class="navbar-toggler"

type="button"

data-toggle="collapse"

data-target="#navbarSupportedContent"

aria-controls="navbarSupportedContent"

aria-expanded="false"

aria-label="Toggle navigation"

>

<span class="navbar-toggler-icon"></span>

</button>

<div class="collapse navbar-collapse" id="navbarSupportedContent">

<ul class="navbar-nav ml-auto">

<li class="nav-item active">

<a class="nav-link px-3" href="#"

>Home <span class="sr-only">(current)</span></a

>

17
 </li>

<li class="nav-item">

<a class="nav-link px-4" href="#categorySection">Categories</a>

</li>

<li class="nav-item">

<a class="nav-link px-4" href="#healthySection">Hygiene</a>

</li>

<li class="nav-item">

<a class="nav-link px-4" href="contactus.html">Contact Us</a>

</li>

</ul>

</div>

<div id="shoppingclass" data-toggle="modal" data-target="#exampleModal">

<i class="fas fa-shopping-cart" id="cart"></i>

<span class="shoppingCartAfter" id="zero">0</span>

</div>

<div class="collapse navbar-collapse" id="navbarSupportedContent">

<ul class="navbar-nav ml-auto">

<div id="login" style="margin-left: -103px;">

<a href="profile.html">

<span class="material-symbols-outlined">account_circle</span>

</a>

</div>

<!-- Other navigation links -->

<li class="nav-item">

18
 <a class="nav-link px-4" href="login.html"></a>

</li>

</ul>

</div>

</div>

</nav>

<a id="scrollToTop" class="btn"><i class="fas fa-caret-up"></i></a>

<div id="main">

<div class="container home-container">

<section id="homeSection" class="d-flex justify-content-center">

<div class="row homeRow">

<div class="col-lg-6 homeTxtCol">

<h1 class="homeHeading">

Where the Flavor <br />

<span data-text="INEBRIATES">INEBRIATES</span>

<br />

you

</h1>

<br />

<div class="homeBtnDiv">

<a href="#categorySection" class="btn homeBtn">Order Now</a>

</div>

</div>

<div class="col-lg-6 homeImgCol">

<img class="homeImg" src="./images/thali.png" alt="momos" />

19
 </div>

</div>

</section>

</div>

<br />

<!-- Category section starts here -->

<section id="categorySection">

<div class="container">

<h1>

<span><b>CATEGORIES</b></span>

</h1>

<div class="row gutters-40">

<div class="col-lg-4 col-sm-4 col-4">

<div class="product-box-layout4 momos">

<div class="item-figure">

<img

src="indianfood.jpg"

alt="Category"

width="100%"

height="100%"

/>

</div>

<div class="item-content">

<h2 class="card-title">INDIAN</h2>

</div>

20
 </div>

</div>

<div class="col-lg-4 col-sm-4 col-4">

<div class="product-box-layout4 chinese">

<div class="item-figure">

<img

src="./images/chinese.webp"

alt="Category"

width="100%"

height="100%"

/>

</div>

<div class="item-content">

<h2 class="card-title">Chinese</h2>

</div>

</div>

</div>

<div class="col-lg-4 col-sm-4 col-4">

<div class="product-box-layout4 beverages">

<div class="item-figure">

<img

src="./images/beverages-updated.webp"

alt="Category"

width="100%"

21
 height="100%"

/>

</div>

<div class="item-content">

<h2 class="card-title">Beverages</h2>

</div>

</div>

</div>

</div>

<!-- MENU STARTS HERE -->

<div class="menuDiv">

<!-- MODAL -->

<div

class="modal fade"

id="exampleModal"

tabindex="-1"

role="dialog"

aria-labelledby="exampleModalLabel"

aria-hidden="true"

>

<div class="modal-dialog" role="document">

<div class="modal-content">

<div class="modal-header">

<h5 class="modal-title" id="exampleModalLabel">Cart</h5>

<button

22
 type="button"

class="close"

data-dismiss="modal"

aria-label="Close"

>

<span aria-hidden="true">&times;</span>

</button>

</div>

<div class="modal-body">

<div class="container-fluid">

<div class="row paymentInfoRow">

<div class="col paymentInfo">

<span class="checkIcon"

><i class="fas fa-check-circle"></i

></span>

Select Menu

</div>

<div class="col paymentInfo">

<span class="checkIcon"

><i class="fa-brands fa-whatsapp"></i

></span>

Place order via Whatsapp

</div>

<div class="col paymentInfo">

<span class="checkIcon"

><i class="fa-brands fa-google-pay"></i>

23
 </span>

Pay using Google Pay.

</div>

</div>

<hr class="cartHr" />

<div class="cartContentDiv">

<h1>Your Cart is Empty</h1>

</div>

<div class="userInfoDiv">

<div class="mb-3 px-2">

<label for="address">Address *</label> <br />

<textarea

type="text"

class="form-control"

id="address"

></textarea>

</div>

<div class="mb-3 px-2">

<label for="note">Note (optional)</label> <br />

<textarea

type="text"

class="form-control"

id="note"

24
 ></textarea>

</div>

</div>

</div>

</div>

<div class="modal-footer">

<div class="totalAmountDiv"></div>

<button

type="button"

class="btn btn-secondary"

onclick="location.reload()"

>

Clear Cart

</button>

<a class="btn btn-primary" onclick="openWhatsapp()">

Order Now

</a>

<button type="button"

class="btn btn-secondary"

style="background-color: #007BFF;

"

>

<a href="trial.html" style="color: black;">Pay Now</a></button>

</div>

</div>

</div>

25
 </div>

<section id="healthySection">

<h1 class="hygiene-title">

<span><b>HYGIENE</b></span>

</h1>

<div class="eatSure container">

<div class="row">

<div class="col-sm-2 col-12">

<img

src="https://assets.faasos.io/ovenstory-react.in/production/eat-sure-mobile.png"

alt="eat-sure logo"

/>

</div>

<div class="container safetyMeasuresDiv">

<p class="safetyMeasuresPara">

While we have always followed hygiene regime at MOMOMIA, we have taken

<br />

a few specific measures at these times.

</p>

<div class="row safetyMeasures">

<div class="col-sm-3 col-6">

<img

src="./svg/mask.svg"

26
 alt="Our Kitchen executives have been instructed to wear masks at all times."

/>

<p>

Our Kitchen executives have been instructed to wear masks at all

times.

</p>

</div>

<div class="col-sm-3 col-6">

<img

src="./svg/thermo.svg"

alt="A daily log of our executives’ body temperatures is being maintained."

/>

<p>

A daily log of our executives’ body temperatures is being <br />

maintained.

</p>

</div>

<div class="col-sm-3 col-6">

<img

src="./svg/sanitizer.svg"

alt="Every kitchen executive sanitizes his/her hands every hour."

/>

<p>

Every kitchen executive sanitizes his/her hands every hour.

27
 <br /><br />

</p>

</div>

<div class="col-sm-3 col-6">

<img

src="./svg/clean.svg"

alt="Every kitchen surface is rigorously cleaned to ensure a clean and sanitized workstation."

/>

<p>

Every kitchen surface is rigorously cleaned to ensure a clean and

sanitized workstation.

</p>

</div>

</div>

</div>

</section>

<!-- TESTIMONIALS SECTION -->

<section id="healthySection" class="testimonials">

<h1 class="hygiene-title">

<span><b>TESTIMONIALS</b></span>

</h1>

<div class="row d-flex justify-content-center">

<div class="col-md-10 col-xl-8 text-center">

<p class="mb-4 pb-2 mb-md-5 pb-md-0">OLD RAO Testimonial</p>

28
 </div>

</div>

<div class="row text-center">

<div class="col-md-4 mb-5 mb-md-0">

<div class="d-flex justify-content-center mb-4">

<img

src="images/LAKSHAY.jpg"

class="rounded-circle shadow-1-strong"

width="150"

height="150"

alt="person"

/>

</div>

<h5 class="mb-3">Lakshay Khanna</h5>

<p class="px-xl-3">

<i class="fas fa-quote-left pe-2"></i>

Good Service, fast Delivery and amazing taste.

</p>

<ul class="list-unstyled d-flex justify-content-center mb-0">

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

29
 <li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

</ul>

</div>

<div class="col-md-4 mb-5 mb-md-0">

<div class="d-flex justify-content-center mb-4">

<img

src="images/POTTER.jpg"

class="rounded-circle shadow-1-strong"

width="150"

height="150"

alt="person"

/>

</div>

<h5 class="mb-3">Hari Om</h5>

<p class="px-xl-3">

<i class="fas fa-quote-left pe-2"></i>Faster Delivery & Fresh food.

</p>

<ul class="list-unstyled d-flex justify-content-center mb-0">

30
 <li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star-half-alt fa-sm text-warning"></i>

</li>

</ul>

</div>

<div class="col-md-4 mb-0">

<div class="d-flex justify-content-center mb-4">

<img

src="images/WhatsApp Image 2024-04-08 at 15.58.13_8d564ddf.jpg"

class="rounded-circle shadow-1-strong"

width="150"

height="150"

alt="person"

/>

31
 </div>

<h5 class="mb-3">Mahesh</h5>

<p class="px-xl-3">

<i class="fas fa-quote-left pe-2"></i>Awesome Taste

</p>

<ul class="list-unstyled d-flex justify-content-center mb-0">

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="fas fa-star fa-sm text-warning"></i>

</li>

<li>

<i class="far fa-star fa-sm text-warning"></i>

</li>

</ul>

</div>

</div>

</section>

32
 <div class="col-sm-2 col-6 borderLeft">

<div class="icon-wrapper">

<svg

xmlns="http://www.w3.org/2000/svg"

id="Capa_1"

enable-background="new 0 0 515.556 515.556"

height="512px"

viewBox="0 0 515.556 515.556"

width="512px"

>

<g>

<path

d="m0 274.226 176.549 176.886 339.007-338.672-48.67-47.997-290.337 290-128.553-

128.552z"

data-original="#000000"

class="active-path"

data-old_color="#000000"

fill="#FFFFFF"

></path>

</g>

</svg>

</div>

<div class="text">Medically Certified Kitchen Staff</div>

</div>

33
 <div class="col-sm-2 col-6 borderLeft">

<div class="icon-wrapper">

<svg

xmlns="http://www.w3.org/2000/svg"

id="Capa_1"

enable-background="new 0 0 515.556 515.556"

height="512px"

viewBox="0 0 515.556 515.556"

width="512px"

>

<g>

<path

d="m0 274.226 176.549 176.886 339.007-338.672-48.67-47.997-290.337 290-128.553-

128.552z"

data-original="#000000"

class="active-path"

data-old_color="#000000"

fill="#FFFFFF"

></path>

</g>

</svg>

</div>

<div class="text">200+ Stringent Quality Checks</div>

</div>

<div class="col-sm-2 col-6 borderLeft">

34
 <div class="icon-wrapper">

<svg

xmlns="http://www.w3.org/2000/svg"

id="Capa_1"

enable-background="new 0 0 515.556 515.556"

height="512px"

viewBox="0 0 515.556 515.556"

width="512px"

>

<g>

<path

d="m0 274.226 176.549 176.886 339.007-338.672-48.67-47.997-290.337 290-128.553-

128.552z"

data-original="#000000"

class="active-path"

data-old_color="#000000"

fill="#FFFFFF"

></path>

</g>

</svg>

</div>

<div class="text">No Artificial Colours or Flavours</div>

</div>

<div class="col-sm-2 col-6 borderLeft">

<div class="icon-wrapper">

35
 <svg

xmlns="http://www.w3.org/2000/svg"

id="Capa_1"

enable-background="new 0 0 515.556 515.556"

height="512px"

viewBox="0 0 515.556 515.556"

width="512px"

>

<g>

<path

d="m0 274.226 176.549 176.886 339.007-338.672-48.67-47.997-290.337 290-128.553-

128.552z"

data-original="#000000"

class="active-path"

data-old_color="#000000"

fill="#FFFFFF"

></path>

</g>

</svg>

</div>

<div class="text">Double Sealed Packaging <br /><br /></div>

</div>

<div class="col-sm-2 col-12 borderLeft">

<a

href="https://eatsure.com/"

36
 target="_blank"

class="btn knowMoreBtn"

>Know More</a

>

</div>

</div>

</div>

<div class="row contactRow">

<a class="footer_clickable" href="./policy.html">Policies</a> |

<a class="footer_clickable" href="./terms_of_service.html"

>Terms of Service</a

>

<!-- <a class="footer_clickable" href="tel:+919871198882">Contact Us</a> -->

<a class="footer_clickable" href="./contactus.html">Contact Us</a>

</p>

</div>

<div class="row copyrightRow">

<p class="copyright">&copy; Copyright OLD RAO All rights reserved.</p>

</div>

</div>

</footer>

</div>

<!-- BOOTSTRAP JS -->

37
 <script

src="https://code.jquery.com/jquery-3.4.1.slim.min.js"

integrity="sha384-
J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n"

crossorigin="anonymous"

></script>

<script

src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"

integrity="sha384-
Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"

crossorigin="anonymous"

></script>

<script

src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"

integrity="sha384-
wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"

crossorigin="anonymous"

></script>

<!-- FONT AWESOME JS -->

<script

src="https://kit.fontawesome.com/9f6e489cf7.js"

crossorigin="anonymous"

></script>

<!-- JQUERY CDN -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<!-- CUSTOM JS -->

38
 <script src="./index.js"></script>

</body>

<!-- BOOTSTRAP JS -->

<script

src="https://code.jquery.com/jquery-3.4.1.slim.min.js"

integrity="sha384-
J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n"

crossorigin="anonymous"

></script>

<script

src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"

integrity="sha384-
Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"

crossorigin="anonymous"

></script>

<script

src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"

integrity="sha384-
wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"

crossorigin="anonymous"

></script>

<!-- JQUERY CDN -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<!-- CUSTOM JS -->

39
 <script src="./index.js"></script>

<script>

$(window).on("load", function () {

$("#loading").hide();

});

</script>

</html>

40
 CHAPTER 5: PROJECT OUTPUT

4.1 Log in Page:

• This is the login page of my food delivery web portal website.

• With the help of this we can enter the username and password.
• After click on the login, then we can enter our main website.
• This login page made with the help of HTML, CSS and node Js.
• If you are a new user, you can also register in this website

4.2 Home Page:

• This is the home page of my food delivery web portal.

• This home page consists of logo of my website and navbar which contains tabs like Home,
Categories, Hygiene and contact Us.
• In the next line, there is some initials about the website like what the project is about .

• And under the front page, we can see the menu.

4.3 Menu Page:

 This is the menu of our website.

 This menu contains 3 categories of food, which are Indian, Chinese and Beverages.

 This portion contains the menu items of the menu.

 When we click on the category, these number of dishes appear on the web page.
42
  Then we can order our expertise items.

4.4 Hygiene and Testimonials:

 This portion contains the hygiene certification.

43
 The testimonials section contains the customer reviews and feedback.

44
4.5 Contact Us and Terms condition:
 This page contains personal information and tells how to contact us.
 This page held some credentials like terms and conditions.

45
4.6 Checkout and Payment System:
 This semi-webpage consists of the checkout process.
 The second image contains the payment system, powered by razor pay.

46
47
 CHAPTER 6: CONCLUSION
In conclusion, the food delivery web portal project represents a significant endeavor in the realm of
online services, addressing the growing demand for convenient access to food options. Through this
project, we have created a platform that bridges the gap between restaurants and consumers, offering a
seamless and efficient way to order food from a variety of establishments. Throughout the development
process, several key objectives were achieved. Firstly, the portal provides a user-friendly interface that
enables customers to browse menus, place orders, and track deliveries with ease. This enhances the
overall user experience and encourages repeat usage. Secondly, the project incorporates robust backend
functionality to manage orders, process payments securely, and coordinate deliveries in real-time.
Integration with third-party services such as payment gateways and mapping APIs ensures smooth
operation and reliability.

Additionally, the web portal includes features to cater to the needs of both restaurant owners and
delivery personnel. Restaurant partners can manage their menus, track orders, and receive feedback
from customers, while delivery agents can view and fulfill incoming orders efficiently. Furthermore,
the project emphasizes scalability and performance to accommodate a growing user base and handle
peak traffic periods effectively. Implementation of caching mechanisms, load balancing, and database
optimization enhances system reliability and responsiveness. In summary, the food delivery web portal
project demonstrates the potential of technology to revolutionize the food industry by providing a
convenient and accessible platform for ordering and delivering meals. By leveraging modern web
development practices and technologies, we have created a solution that meets the needs of consumers,
restaurants, and delivery partners alike, fostering greater convenience and efficiency in the food
delivery ecosystem.

48
 CHAPTER 7: FUTURE SCOPE
The future scope of a food delivery web portal project holds immense potential for further growth and
innovation. Here are several avenues for future development and expansion:

1. Enhanced Personalization: Implementing advanced algorithms and machine learning techniques

can enable personalized recommendations based on user preferences, order history, and browsing
behaviour. This can improve user engagement and increase order frequency.

2.Integration of IoT Devices: Integration with Internet of Things (IoT) devices such as smart
refrigerators or kitchen appliances can streamline the ordering process. For example, users could
automatically replenish groceries or place orders based on inventory levels detected by IoT sensors.

3. Augmented Reality (AR) Menus: Introducing AR features to the web portal can provide an
immersive dining experience. Users can visualize menu items in 3D, view nutritional information, or
see virtual representations of dishes before placing an order.

4. Expansion of Delivery Services: Diversifying delivery options beyond traditional courier services
opens up new possibilities. Partnering with drone delivery companies or autonomous vehicle providers
could offer faster and more cost-effective delivery solutions, especially in urban areas.

5. Blockchain for Transparency: Implementing blockchain technology can enhance transparency and
traceability in the food supply chain. Users can track the origin and journey of ingredients from farm to
table, ensuring food safety and quality.

6. Social Integration: Integrating social media features into the web portal allows users to share their
dining experiences, reviews, and recommendations with friends and followers. This can increase brand
visibility and foster community engagement.

7. Voice-Activated Ordering: Integrating voice recognition technology enables users to place orders
using voice commands through virtual assistants like Siri, Google Assistant, or Alexa. This hands-free
approach enhances accessibility and convenience.

8. Sustainability Initiatives: Incorporating eco-friendly practices such as biodegradable packaging,

promoting locally sourced ingredients, or offering plant-based menu options aligns with growing
consumer preferences for sustainability and environmental responsibility.

9. Global Expansion: Scaling the food delivery web portal to new geographic regions or markets
presents opportunities for growth. Adapting to local preferences, cuisines, and languages can attract a
diverse customer base and increase market penetration.

10. Data Analytics for Business Insights: Leveraging data analytics tools and techniques can provide
valuable insights into customer behaviour, market trends, and operational efficiency. This data-driven
approach enables informed decision-making and optimization of business processes.
 BIBLIOGRAPHY

I. www.google.com
II. www.javatpoint.com
III. www.wikipedia.com