SOFTWARE/INDUSTRIAL TRAINING AND

PROJECT REPORT
On
Full Stack Web Development
At
Vprotech Digital
Submitted by:
Abhiraj Singh (2027037)
In partial fulfillment of the requirement of the award of the degree
of
BACHELOR OF TECHNOLOGY
in
ELECTRONICS AND COMMUNICATION ENGINEERING
at
CHANDIGARH ENGINEERING COLLEGE
JHANJERI, MOHALI (NAAC A+)
PUNJAB (INDIA)-140307

JUNE 2024

Affiliated to
I.K. Gujral Punjab Technical University Kapurthala, Punjab, India
 DECLARATION

I, hereby declare that I have undergone six months of Software Training at Vprotech
Digital, Mohali which is presented and submitted, in partial fulfillment of the
requirements for the award of the degree of Bachelor of Technology in Electronics &
Communication Engineering to the Department of Electronics & Communication
Engineering, Chandigarh Engineering College, Jhanjeri, Mohali is an authentic record
of my own training work carried out from February 2024 to May 2024 at Vprotech
Digital, Faridabad. The project report has not been copied or plagiarized from any
other source and has not been submitted to any educational institute for the award of
any certificate, diploma, degree, or recognition.

This is an authentic piece of work and in case there is any query regarding the same, I
shall be held responsible for answering any queries in this regard.

Date: /6/2024 Signature of Candidate

Abhiraj Singh

Training Mentor HOD ECE

Dr. Sarabpreet Kaur Dr. Hunny Pahuja

I
 ACKNOWLEDGEMENT

I am highly grateful to Dr. Hunny Pahuja, HOD Department of Electronics

and Communication Engineering, CEC, Jhanjeri for providing this opportunity
to carry out the six months of industrial training at Vprotech Digital Pvt. Ltd.,
Mohali.

I would like to express my gratitude to other faculty members of the

Department of Electronics and Communication Engineering, CEC Jhanjeri for
providing academic input, guidance & encouragement throughout the training
period.

I would like to express a deep sense of gratitude and thank Dr. Sarabpreet
Kaur, mentor of the project, without whose permission, wise counsel, and able
guidance, it would have not been possible to pursue my training in this manner.

Finally, I express my indebtedness to all who have directly or indirectly

contributed to the successful completion of my industrial training.

Abhiraj Singh
2027037

II
CERTIFICATE

III
 ABSTRACT

E-Commerce web application, Cooperative Store Management System is the platform

where customers can shop online without having to visit the store physically. It aimed
at reducing the workload of the salesperson and minimizing manual errors by
automating the record entry. Customers can hugely minimize the cost incurred and
time wasted by the use of a system. Moreover, customers can get better services and
the shopping can be done at one’s convenience as the services can be availed from
their home. This will not only help to attract new customers but also retain regular
customers which ultimately helps the business to grow in the long run. Interviews,
brainstorming, and team meetings were done to get the complete requirement of data
for a system.

E-commerce websites serve as digital platforms where businesses can sell products or
services directly to customers over the Internet. Web development plays a crucial role
in creating and maintaining these websites, providing the necessary functionality and
features to support online transactions.

The Frontend interface can be used by the customers to view the items and place
orders as per their needs. The backend interface can be used by the staff working in
the store to perform Create, Read, Update, and Delete (CRUD) operations. The paper
is going to provide information on the processes involved during the development of
the application. It will also present the design process, methodology, and overall
working of the system.

IV
 LIST OF FIGURES

FIGURE NUMBER PAGE NO.

Fig 2.1 Mern Stack 5

Fig 5.0 Sequence diagram for administrator 31
Fig 5.1 Npm install 33
Fig 5.2 About Js 33
Fig 5.3 Index Html 34
Fig 5.4 Index Html 2 36
Fig 5.5 Index Html 3 37
Fig 5.6 Organization structure 40
Fig 5.7 Folder structure 41
Fig 5.8 Frontend package. Json 42
Fig 5.9 Frontend package-lock. Json 42
Fig 5.10 App.Js 43
Fig 5.11 Index.Js 43
Fig 5.12 commentBox.Js 44
Fig 5.13 comment.Js 44
Fig 5.14 Home.Js 45
Fig 5.15 login.Js 45
Fig 5.16 Menu.Js 46
Fig 5.17 System design 47

V
Fig 5.18 ER diagram 49
Fig 5.19 ADMIN TABLE 51
Fig 6.1 Login page 52
Fig 6.2 Dashboard 53
Fig 6.3 Dashboard 2 53
Fig 6.4 view or edit page 54
Fig 6.5 add customer page 54

VI
 TABLE OF CONTENTS

PARTICULARS PAGE NO.

DECLARATION I
ACKNOWLEDGEMENT II
CERTIFICATE III
ABSTRACT IV
LIST OF FIGURES V-VI
TABLE OF CONTENTS VII-VIII
CHAPTER 1 INTRODUCTION OF ORGANIZATION 1-2
CHAPTER 2 INTRODUCTION OF PROJECT 3-7
2.1 OVERVIEW 3
2.2 AIM AND OBJECTIVE 5
CHAPTER 3 HARDWARE AND SOFTWARE REQUIREMENTS 8-23
3.1 SYSTEM ENVIRONMENT 8
3.2 TOOLKIT 9
CHAPTER 4 INDUSTRIAL TRAINING AND WORK DONE 24-29
4.1 OVERVIEW OF THE PROJECT 24
4.2 FEASIBILITY STUDY 26
4.3 LITERATURE REVIEW 28
CHAPTER 5 PROJECT WORK 30-51
5.1 PROPOSED SOLUTION 30
5.2 WORKING OF PROJECT 30
5.3 PLANNING 37

VII
 5.4 SOFTWARE DESIGN 38
5.5 ORGANIZATION STRUCTURE 40
5.6 CODE SNIPPETS 41
5.7 SYSTEM DESIGN 47
5.8 ER DIAGRAM 49
5.9 DATA DIRECTORY 51
CHAPTER 6 RESULT AND DISCUSSION 52-54
6.1 RESULTS 52
6.2 RESULTS SCREENSHOTS 52
CHAPTER 7 CONCLUSION AND FUTURE SCOPE 55-57
7.1 FUTURE SCOPE OF THE PROJECT 55
7.2 CONCLUSION 56
REFERENCES 58

VIII
 Chapter-1
INTRODUCTION OF ORGANISATION

Vprotech Digital is a well-known manufacturer and exporter of Horizontal Flow

Wrap Machines, Automatic Rusk Packaging Machines, Ribbon Blender Mixer
Machines, Ice Candy Packaging, and other similar products. The machines on offer
are built with the highest quality components and cutting-edge technology. Our
professionals produce these machines with extreme precision in order to meet
international quality requirements.

Our clients value our machines for their durability, superior performance, ease of
maintenance, simplicity of operation, and extended service life. These machines are
available in a variety of technical parameters to meet the individual needs of clients.

We have an advanced infrastructure facility that allows us to give the best range in the
market. Our infrastructure facility, which has a huge production capacity, is divided
into numerous sections such as manufacturing, quality testing, warehousing, and
packaging. Our quality testing section, which is equipped with a sophisticated
laboratory, is in charge of quality control, and all tests are carried out with great
precision. Without the dedicated team's help, the quick success would not have been

1
feasible. Technocrats, engineers, researchers, warehouse specialists, quality
controllers, sales and marketing executives, and other qualified employees comprise
our highly skilled team of professionals.
With a thorough quality management system in place, our products are quality
verified on many aspects at each stage of development.

Academic Excellence built through inspiring teaching pedagogy has always been a
hallmark of Vprotech Digital. The overall focus is on inculcating a critical and
optimal blend of theory, practical and live projects that lead to experimental learning
and makes the students industry ready.

2
 Chapter-2
INTRODUCTION OF PROJECT

2.1 OVERVIEW

In many popular restaurants, waiters/waitresses tend to miss out on tables or

customers’ calls during busy hours potentially decreasing one's clientele. While this is
an ongoing issue, there is still no product that drastically improves the communication
between the servers and the customers in the current market. Hence, the goal is to
design a system in which the customers can call their servers easily and help the
restaurant increase overall efficiency. An internal wired communication system will
allow prompt notification to the server when a customer requires service. Moreover,
servers can also be more focused on serving their current customers and save their
time and energy by always keeping an eye out for needy customers.

On top of meeting the needs of customers, restaurant managers can also monitor the
response time of their waiters/waitresses through the use of this system. Hardworking,
proficient employees will become more recognized while lazy, inefficient employees
become motivated to improve. As a result, the restaurant becomes more efficient and
possibly increases morale while improving the level of customer satisfaction.

Customer satisfaction is the key to success for any business. In a restaurant, the
traditional hand-waving method for calling services is inefficient often leading to
many complaints. The Restaurant Management System increases operational
efficiency through use of an internal wired communications system. The
communications system increases customer satisfaction by leaving a system at each
table that the customer can use to request a server. This system allows managers and
owners to easily monitor restaurant functions and employee progress.

3
In many popular restaurants, waiters/waitresses tend to miss out on tables or
customers’ calls during busy hours potentially decreasing one's clientele. While this is
an ongoing issue, there is still no product that drastically improves the communication
between the servers and the customers in the current market. Hence, the goal is to
design a system in which the customers can call their servers easily and help the
restaurant increase overall efficiency.

A restaurant website is designed to manage all the functionalities of a restaurant. It

helps the owner to maintain the database of customers who booked the table along
with dates and a database of users who want to subscribe to their newsletter for news
updates and their food recipes. Users can also add, update, delete, and see the
comments in the website. This complete project is based on MERN stack technology.

With the MERN Stack, a JavaScript Stack, full-stack online applications can be
deployed rapidly and easily. MongoDB, Express, React, and Node.js are all part of the
MERN Stack. It was created to speed up and improve the development process.
All these four powerful techniques provide an end-to-end architecture for creating
MERN stack open-source projects such as online apps.

M for MongoDB

In MERN, the “M” refers to Mango DB, which is the database tier for a MERN
application. MongoDB is a document-oriented No-SQL database used to hold
back-end applications.
Objects —> Collection —> Documents —> Data

E for Express JS

Express is a layered framework; the responsibility of this is to take care of the

structure and functionality of the back end and topped on Node.js, which makes
Node-based Web app development much faster.

4
R for React: Front End Library

React facilities the creation of a user interface on a single-page web application and
was developed and distributed by Facebook as an open-source library.

N for Node.js: JS Runtime Environment

Node.js is a back-end JavaScript execution framework that works across several

platforms and is open source. The V8 engines that power Node.js are responsible for
running JS code.

Fig 2.1 Mern Stack

2.2 AIM AND OBJECTIVE

Now a day, the world is getting into a digital world. The system was trying to build
out to make people even more convenient in any aspect. Restaurant Management
System provides a system-based food ordering system without the help of a waiter. It
involves seller and buyer which could bring benefits to each other. It is win-win
situation that will bring benefits to the world.

This system was bringing convenience for customers that can make orders with the
help of a computer.

5
It provides customers with a completely new way to make orders. By providing
customer convenience and also increasing sales. No time is wasted with order taking
or letting the customer browse the menu over the system.

This system provides more reliable usability, maintainability and dependability

functions. By creating quality, easy-to-keep track management of new system. So that
it can streamline all the works by a simple click. By developing a system-based food
ordering system can reduce unnecessary costs such as staff salaries, customer
satisfaction, reputation, etc. Our restaurant also easy to keep track of maintenance and
point redemption.

The approach used in this project is a top-down approach. A top-down approach (also
known as stepwise design and in some cases used as a synonym of decomposition) is
essentially the breaking down of a system to gain insight into its compositional
sub-systems in a reverse engineering fashion. In a top-down approach, an overview of
the system is formulated, specifying, but not detailing, any first-level subsystems.

Each subsystem is then refined in yet greater detail, sometimes in many additional
subsystem levels, until the entire specification is reduced to base elements. A
top-down model is often specified with the assistance of "black boxes", which makes
it easier to manipulate.

However, black boxes may fail to clarify elementary mechanisms or be detailed

enough to realistically validate the model. The top-down approach starts with the big
picture. It breaks down from there into smaller segments.

A few of the objectives are -

● Service or product advertising

The main purpose of a business site is to promote a company’s

products, services or events on the Internet. There are two main

6
 aspects to discuss. First, there are websites that don’t directly sell
anything but their objective is to create “buzz” or awareness. An
example would be, let’s say an event - a trance music performance
taking place next month.

● Selling a product or a service online

This is basically the main reason behind the existence of any

business website. Selling products and services is the most common
objective. You have to provide full and comprehensive information
on what you sell, allowing prospective customers to easily order
from your site.

● Providing product support and customer service

Due to its wold-wide nature, the Internet is a flexible structure allowing

users to choose from thousands of similar products they are just one
click away. What actually makes the difference between similar online
businesses are the price and the customer support they provide.

● Establishing brand awareness and identity

Establishing brand awareness or company identity is an ongoing

process with the purpose of branding products with memorable names,
eye-catching logos and maybe a slogan. In order to establish brand
identity, your website must address these elements in a unitary manner.

7
 Chapter-3
HARDWARE AND SOFTWARE REQUIREMENTS

3.1 SYSTEM ENVIRONMENT

After analysis, some resources are required to convert the abstract system into the real
one. The hardware and software selection begins with requirement analysis, followed
by a request for proposal and vendor evaluation. Every application needs software in
which it can be executed and hardware on which the application can perform its
functions.

HARDWARE SPECIFICATIONS

Processor: Intel Pentium IV or more

RAM: 2 GB or more

Hard Disk Drive: 16 GB or more

Cache: 1 MB

SOFTWARE SPECIFICATIONS

Operating System: Windows 7/8/10/11 or Linux

Client on the Internet: Chrome or any other web browser

Web Server: NodeJs

Database Management System: MongoDB or any other database

Code editor or IDE: Notepad++, Visual Studio Code, or Sublime

Text

8
3.2 TOOLKIT

React.JS

React is a widely popular JavaScript library that is used for building user interfaces. It
was developed by Facebook and has gained significant adoption within the web
development community due to its efficiency, flexibility, and component-based
architecture.

At its core, React focuses on creating reusable UI components. These components are
like building blocks that encapsulate specific functionalities and can be easily
composed to create complex user interfaces. This component-based approach enables
developers to break down their user interface into smaller, manageable pieces, making
the code more modular, maintainable, and easier to test.

One of the key features of React is its virtual DOM (Document Object Model)
implementation. The virtual DOM is an abstraction of the actual DOM and serves as a
lightweight representation of the user interface. React efficiently updates and renders
changes to the virtual DOM and then intelligently determines and applies only the
necessary updates to the actual DOM, resulting in faster and more efficient rendering.

React follows a unidirectional data flow, also known as one-way data binding. This
means that data flows in a single direction, from parent components to child
components. This approach simplifies the debugging and understanding of data
changes within the application, making it easier to track and manage state.

React also supports JSX, a syntax extension that allows developers to write
HTML-like code within JavaScript. JSX makes it easier to create and manipulate
components by providing a more intuitive and expressive syntax. Under the hood,
JSX is transpiled into regular JavaScript code, which is then executed by the browser.

Another advantage of React is its large and active community. React has a thriving
ecosystem of libraries, tools, and community support. This ecosystem provides
developers with a wealth of resources, open-source projects, and community-driven

9
solutions to common challenges, making it easier to learn, develop, and maintain
React applications.

React is not a complete framework but rather a library focused on the view layer of an
application. It can be used alongside other libraries or frameworks to build
full-featured applications. React can be integrated seamlessly with various
technologies, including state management libraries like Redux or MobX, server-side
rendering frameworks like Next.js, and mobile app development platforms like React
Native.

In summary, React is a powerful and efficient JavaScript library that simplifies the
process of building interactive and dynamic user interfaces. Its component-based
architecture, virtual DOM, one-way data flow, JSX syntax, and vibrant community
make it an excellent choice for developing modern web applications.

Node.JS

Node.js is a powerful and versatile JavaScript runtime environment built on Chrome's

V8 JavaScript engine. It allows developers to run JavaScript code outside of a
browser, enabling server-side and command-line scripting capabilities. Node.js
provides a non-blocking, event-driven architecture that makes it highly efficient and
scalable.

One of the key features of Node.js is its ability to handle a large number of concurrent
connections with low overhead. It achieves this through its asynchronous,
non-blocking I/O model. This means that Node.js can efficiently handle multiple
requests without getting blocked, making it ideal for building high-performance
applications, real-time web applications, and APIs.

Node.js has a vast ecosystem of libraries and modules available through the npm
(Node Package Manager). This extensive package repository provides developers with
a wide range of ready-to-use tools and frameworks to accelerate development.

10
Additionally, Node.js allows developers to easily create their own modules and share
them with others, fostering a collaborative and active community.

Another advantage of Node.js is its ability to handle both back-end and front-end
development. With Node.js, developers can write server-side code, handle database
operations, and build APIs. Moreover, Node.js can be used to create lightweight web
servers, enabling the serving of static files, rendering dynamic web pages, and
handling HTTP requests.

Node.js is highly suitable for building real-time applications, such as chat

applications, collaborative tools, and gaming platforms, where instant data updates
and seamless communication between clients and servers are essential.

Furthermore, Node.js is widely adopted by major companies and organizations due to

its performance, scalability, and developer-friendly environment. It is used by
companies like Netflix, LinkedIn, PayPal, and Uber, among many others, to build
scalable and high-performance applications.

In summary, Node.js is a powerful JavaScript runtime that allows developers to build

scalable, high-performance applications on the server-side. Its asynchronous and
event-driven architecture, extensive package ecosystem, and versatility make it a
popular choice for building real-time applications, APIs, and server-side web
applications.

Express.JS

Express.js is a fast, minimalistic, and flexible web application framework for Node.js.
It provides a robust set of features and utilities for building web applications and
APIs. Express.js simplifies the process of handling HTTP requests, routing,
middleware integration, and view rendering, making it a popular choice for web
development.

One of the key advantages of Express.js is its simplicity. It offers a minimalist

approach, allowing developers to quickly set up a basic server with minimal code. The

11
framework provides a straightforward API for defining routes and handling various
HTTP methods, such as GET, POST, PUT, and DELETE. Express.js also supports
middleware, which enables developers to enhance the functionality of their
applications by adding modular components that process incoming requests and
responses.

Express.js is highly extensible, allowing developers to leverage its flexibility to

customize and enhance their applications. It provides a wide range of middleware
modules that handle tasks such as parsing request bodies, session management,
authentication, and error handling. Additionally, Express.js integrates seamlessly with
other Node.js libraries and packages, making it easy to incorporate additional
functionalities as needed.

The framework also supports template engines, such as EJS and Handlebars, making
it convenient to render dynamic views and generate HTML responses. Express.js
provides a clean separation of concerns, allowing developers to structure their code in
a modular and organized manner.

Express.js has a large and active community, which contributes to its popularity and
extensive ecosystem. The community-driven nature of Express.js ensures a wealth of
resources, tutorials, and third-party modules available through npm (Node Package
Manager).

In summary, Express.js is a lightweight and flexible web application framework for

Node.js. It simplifies the process of building web applications and APIs by providing
a clean and minimalist API, middleware support, and extensibility. With its
simplicity, flexibility, and active community, Express.js is an excellent choice for
developers seeking a versatile and efficient framework for building web applications.

HTML

HTML (Hypertext Markup Language) is the standard markup language used for
creating and structuring web pages and applications on the internet. It provides a set
of

12
tags and attributes that define the structure, content, and presentation of a web
document.

HTML uses a hierarchical structure known as the Document Object Model (DOM) to
organize and represent the elements of a web page. Each element, such as headings,
paragraphs, images, links, forms, and tables, is defined using HTML tags. Tags are
enclosed in angle brackets and consist of an opening tag, content, and a closing tag.

HTML allows developers to format and style the content of a web page using CSS
(Cascading Style Sheets). CSS is used to control the appearance of HTML elements,
including layout, colors, fonts, and other visual aspects. By separating the structure
and presentation, HTML ensures a clear separation of concerns and promotes better
maintainability and flexibility.

HTML also supports hyperlinks, which enable users to navigate between web pages.
Hyperlinks are created using the <a> (anchor) tag and specify the destination URL.
They can be used to link to other web pages, sections within the same page, external
resources, or even trigger specific actions.

Furthermore, HTML provides support for multimedia elements, such as images,

audio, video, and embedded content. These elements allow developers to enrich web
pages with visual and interactive content, making the browsing experience more
engaging for users.

HTML is a markup language that is interpreted by web browsers, which parse the
HTML code and render it into a visual representation for users. It is a core technology
for web development and serves as the foundation for creating content on the World
Wide Web.

In summary, HTML is a markup language used to structure and format the content of
web pages. It provides a set of tags and attributes to define the elements and their
relationships within a document. HTML, along with CSS and other technologies,
forms the basis for creating visually appealing and interactive websites and
applications.

13
CSS (Cascading Style Sheets)

CSS is a style sheet language used to describe the presentation and visual appearance
of web pages written in HTML or XML. It provides a powerful set of rules and
properties that define how elements on a web page should be displayed, including
layout, colors, fonts, and other visual aspects.

CSS works by selecting HTML elements and applying styles to them. Styles can be
defined inline within HTML tags, embedded within the <style> tag within the <head>
section of an HTML document, or externalized in separate CSS files that are linked to
the HTML document.

CSS uses selectors to target specific elements and apply styles to them. Selectors can
be based on element types, classes, IDs, attributes, or their relationships with other
elements. CSS selectors provide a flexible and granular way to define the styles for
different elements and create consistent designs across multiple web pages.

CSS supports a wide range of properties that control the visual appearance of
elements. These properties include options for setting colors, fonts, margins,
paddings, borders, backgrounds, and more. CSS also provides features for responsive
design, allowing developers to create layouts that adapt to different screen sizes and
devices.

One of the key advantages of CSS is its ability to separate the presentation from the
structure and content of a web page. This separation, known as the separation of
concerns, improves maintainability, reusability, and flexibility. By separating the
styles into CSS files, developers can easily update the visual aspects of a website
without modifying the underlying HTML structure.

CSS has evolved over the years, and its latest version, CSS3, introduced a wide range
of new features and capabilities, including animations, transitions, gradients, flexbox,
grid layout, and more.

In summary, CSS is a powerful style sheet language that controls the visual
appearance of HTML and XML documents. It allows developers to define styles and
layouts, create consistent designs, and separate presentation from content. CSS plays a

14
crucial role in web development, enabling the creation of visually appealing and
responsive web pages.

JavaScript

JavaScript is a versatile and widely-used programming language that powers dynamic

and interactive web applications. It was initially developed for web browsers but has
evolved to become a versatile language used in various environments, including
server-side development and mobile app development.

JavaScript enables developers to add functionality to web pages by manipulating the

Document Object Model (DOM). With JavaScript, developers can dynamically
update and modify the content and behavior of web pages based on user interactions
and events. It provides features for handling form submissions, validating user inputs,
making HTTP requests, and much more.

One of the key features of JavaScript is its ability to run directly in a web browser
without the need for compilation. It is an interpreted language, which means that the
browser executes the code as it encounters it. This makes JavaScript an accessible and
user-friendly language for both beginners and experienced developers.

JavaScript is also widely used as a server-side language with the introduction of

platforms like Node.js. With Node.js, JavaScript can be used to build scalable and
high-performance server applications. It allows for non-blocking, event-driven I/O
operations, making it suitable for handling concurrent connections and real-time
applications.

The language has a vast ecosystem of libraries, frameworks, and tools that extend its
capabilities. Popular JavaScript frameworks like React, Angular, and Vue.js enable
developers to build complex and interactive user interfaces. Libraries like jQuery
provide simplified ways to interact with the DOM and handle cross-browser
compatibility.

15
Moreover, JavaScript has expanded beyond web development and is now used in
areas such as game development, desktop applications, and even Internet of Things
(IoT) devices.

In summary, JavaScript is a versatile programming language that powers dynamic

web applications and enables interactivity on the client-side. Its capabilities extend
beyond the web browser, with the ability to develop server-side applications and other
types of software. JavaScript's wide adoption, extensive ecosystem, and accessibility
make it a fundamental language for modern software development.

Web Application

A web application, also known as a web app, is a software application that runs on
web browsers and is accessed over the internet. It is designed to provide interactive
functionality, data processing, and user engagement through a web-based interface.
Web applications can be accessed on various devices, including desktop computers,
laptops, tablets, and smartphones.

Web applications are typically built using a combination of technologies, including

HTML, CSS, and JavaScript for the front-end user interface, and server-side
technologies such as PHP, Python, Ruby, or Node.js for handling data processing and
server-side logic. The client-side (front-end) of a web application is responsible for
rendering the user interface, handling user interactions, and making requests to the
server. The server-side (back-end) is responsible for processing these requests,
performing database operations, and returning responses to the client.

Web applications provide a wide range of functionalities, ranging from simple to

complex. They can include features such as user authentication and authorization, data
storage and retrieval, real-time updates, social media integration, e-commerce
capabilities, content management systems, and much more. Web applications can be
tailored to specific industries or domains, such as finance, healthcare, education,
e-commerce, or social networking.

16
One of the key advantages of web applications is their cross-platform compatibility.
Since web apps run in a browser, they can be accessed from different operating
systems and devices, reducing the need for platform-specific development.
Additionally, web applications can be updated centrally on the server, ensuring that
users always have the latest version without the need for manual updates.

Web applications have gained popularity due to their accessibility, as they can be
accessed from any location with an internet connection. They eliminate the need for
installing software locally, making them convenient for users and reducing
maintenance efforts for developers.

In summary, web applications are software applications accessed through web

browsers that provide interactive functionality and data processing over the internet.
They are built using a combination of front-end and back-end technologies and can
offer a wide range of features and services. Web applications are widely used across
various industries and provide cross-platform compatibility and easy accessibility for
users.

Visual Studio Code

Visual Studio Code, commonly referred to as VS Code, is a free and lightweight

source code editor developed by Microsoft. It is widely used by developers for
writing, editing, and debugging code across various programming languages and
platforms.

VS Code offers a rich and customizable user interface that enhances productivity and
provides a seamless coding experience. It supports a wide range of features, including
syntax highlighting, intelligent code completion, code navigation, code refactoring,
and debugging capabilities. These features are powered by built-in language services
and extensions, which can be easily installed from the Visual Studio Code
marketplace.

17
One of the key strengths of VS Code is its extensive extension ecosystem. Developers
can personalize and enhance their coding environment by installing extensions for
specific languages, frameworks, and tools. These extensions provide additional
functionalities, such as linters, formatters, version control integration, code snippets,
and more. The vibrant extension community ensures that developers have access to a
wide range of tools to suit their specific needs.

VS Code also includes integrated terminal support, allowing developers to execute

commands and run scripts directly within the editor. It offers seamless integration
with popular version control systems like Git, making it easy to manage and track
code changes.

Another notable feature of VS Code is its cross-platform compatibility. It runs on

Windows, macOS, and Linux, providing a consistent development experience across
different operating systems.

Furthermore, VS Code has a highly customizable user interface, allowing developers

to personalize their coding environment by adjusting themes, keyboard shortcuts, and
layout configurations. It supports a wide range of programming languages
out-of-the-box and provides an intuitive and user-friendly interface.

In summary, Visual Studio Code is a versatile and lightweight code editor that
provides a powerful set of features and a vast extension ecosystem. It offers a
seamless coding experience across multiple programming languages and platforms,
enhancing developer productivity. With its cross-platform compatibility and
customizable interface, VS Code has become a popular choice among developers for
their coding needs.

Database

A database is a structured collection of data that is organized and stored in a manner

that allows for efficient retrieval, manipulation, and management of information. It is

18
a fundamental component of modern software applications and plays a crucial role in
storing and accessing data.

Databases are designed to handle large volumes of data and provide mechanisms for
organizing and structuring information. They use a systematic approach to store data
in tables, which consist of rows and columns. Each row represents a specific record or
instance, while columns define the attributes or properties of the data.

There are various types of databases, with the most common being relational
databases. Relational databases store data in structured tables and establish
relationships between different tables through keys or identifiers. They use Structured
Query Language (SQL) for querying and manipulating data.

Databases provide several benefits, including data integrity, data consistency, and data
security. They enforce constraints and rules to ensure that the data remains accurate
and consistent. Databases also offer mechanisms for backup and recovery, protecting
data from loss or corruption.

Database management systems (DBMS) are software applications that enable users to
interact with databases. DBMS provides a set of tools and functionalities for creating,
modifying, and managing databases. It includes features such as data modeling, data
definition language (DDL), data manipulation language (DML), indexing, transaction
management, and more.

Databases are widely used in various industries and applications, including

e-commerce, banking, healthcare, supply chain management, and more. They serve as
a reliable and efficient means for storing and retrieving data, allowing organizations to
make informed decisions, maintain records, and support business operations.

In summary, a database is a structured collection of data that provides a mechanism

for storing, organizing, and managing information. It plays a vital role in modern
software applications and offers benefits such as data integrity, consistency, and
security. With the help of database management systems, organizations can efficiently

19
handle large volumes of data and leverage it to support their business processes and
decision-making.

MySQL

MySQL is an open-source relational database management system (RDBMS) that is

widely used for storing and managing structured data. It is one of the most popular
and widely adopted database systems in the world. MySQL is known for its
performance, scalability, and ease of use, making it suitable for a wide range of
applications.

MySQL follows the client-server architecture, where clients can connect to the
MySQL server to perform database operations. It supports multiple storage engines,
allowing users to choose the one that best fits their specific requirements. The default
storage engine is InnoDB, which provides ACID (Atomicity, Consistency, Isolation,
Durability) compliance and supports transactions.

One of the key strengths of MySQL is its flexibility and compatibility with various
platforms and programming languages. It provides comprehensive support for SQL
(Structured Query Language), allowing users to perform complex queries, data
manipulation, and data definition tasks. MySQL can be easily integrated with popular
programming languages like PHP, Python, Java, and more, making it a preferred
choice for web applications.

MySQL offers features like data replication, allowing users to create redundant copies
of databases for improved reliability and fault tolerance. It also provides support for
clustering and sharding, enabling scalability and high availability in large-scale
deployments.

MySQL has an active community that contributes to its development and provides
continuous support. It offers extensive documentation, forums, and resources that help
developers and administrators effectively use and optimize the database.

20
MySQL is used in a wide range of applications, from small-scale websites and
applications to large-scale enterprise systems. It finds applications in e-commerce,
content management systems, financial systems, social media platforms, and more.

In summary, MySQL is a powerful and widely used open-source relational database

management system. It offers performance, scalability, and ease of use, making it
suitable for various applications. With its robust features, compatibility, and active
community, MySQL continues to be a popular choice for developers and
organizations seeking reliable and efficient database solutions.

Netlify

Netlify is a cloud-based hosting and deployment platform designed to simplify and

streamline the process of building, deploying, and managing modern web projects. It
provides developers with a seamless workflow for static site generation, continuous
deployment, and serverless functions.

One of the key features of Netlify is its ability to host static websites and applications.
Developers can easily connect their code repositories, such as GitHub or GitLab, to
Netlify and automatically trigger builds and deployments whenever changes are
pushed to the repository. Netlify handles the build process, optimizing assets, and
delivering the static files through a global Content Delivery Network (CDN) for fast
and reliable performance.

Netlify also supports serverless functions, allowing developers to add dynamic and
server-side functionality to their static sites without the need to manage a separate
server. These functions can be written in popular programming languages such as
JavaScript, Go, or Python and can be used to handle form submissions, process
payments, or interact with external APIs.

Another notable feature of Netlify is its integration with popular static sites generators
like Gatsby, Hugo, and Jekyll. It provides build plugins and optimizations specific to

21
these frameworks, enabling developers to leverage the full potential of their chosen
tools.

Additionally, Netlify offers features for team collaboration and deployment

workflows. It allows developers to set up preview environments for each branch,
enabling seamless collaboration and feedback before merging code into the main
branch. Netlify also integrates with popular Continuous Integration/Continuous
Deployment (CI/CD) services like CircleCI and Jenkins, providing a comprehensive
deployment pipeline.

Netlify's user interface is intuitive and user-friendly, offering insights and analytics for
site performance, form submissions, and more. It also provides features for custom
domain management, SSL certificate provisioning, and automatic HTTPS
configuration.

In summary, Netlify is a cloud-based hosting and deployment platform that simplifies

the process of building and deploying modern web projects. With its support for static
sites, serverless functions, integration with popular static site generators, and
collaboration features, Netlify offers a comprehensive solution for developers to
create, deploy, and manage their web applications with ease.

React Bootstrap

React-Bootstrap is a popular open-source UI framework that combines the power of

React, a JavaScript library for building user interfaces, with Bootstrap, a widely used
front-end framework. It provides a collection of pre-built, reusable components that
can be easily integrated into React applications, enabling developers to create
responsive and visually appealing user interfaces with ease.

React-Bootstrap follows a component-based approach, where each UI element is

encapsulated within a React component. These components are designed to be
modular and reusable, allowing developers to efficiently build complex UI layouts by
composing smaller components together. Examples of components provided by

22
React-Bootstrap include buttons, forms, navigation bars, modals, alerts, and much
more.

One of the key advantages of using React-Bootstrap is its seamless integration with
React. Developers can leverage the power of React's virtual DOM and component
lifecycle to efficiently manage the state and behavior of the UI components. This
integration enables a smooth and performant user experience, as only the necessary
components are re-rendered when the underlying data changes.

React-Bootstrap also offers responsive design out of the box, allowing applications to
automatically adapt and adjust their layout based on the screen size and device type.
This ensures that the user interface remains consistent and accessible across various
platforms and devices.

Additionally, React-Bootstrap provides a robust grid system that allows developers to

create flexible and responsive layouts. The grid system enables the alignment and
positioning of components in a structured manner, facilitating the creation of visually
appealing and responsive designs.

Furthermore, React-Bootstrap offers customization options, allowing developers to

modify the appearance and behavior of components to match their specific design
requirements. It also provides theming capabilities, making it easy to create consistent
and branded UIs.

In summary, React-Bootstrap is a powerful UI framework that combines the

flexibility of React with the extensive component library of Bootstrap. It simplifies
the process of building responsive and visually appealing user interfaces in React
applications by providing pre-built components, responsive design features, and
customization options. With its seamless integration with React, React-Bootstrap
empowers developers to create modern and engaging user interfaces efficiently.

23
 Chapter-4
INDUSTRIAL TRAINING AND WORK UNDERTAKEN

4.1 OVERVIEW OF THE PROJECT

In busy restaurants, waiters often miss tables or customer calls, which can reduce the
number of customers. Unfortunately, there is currently no product that significantly
improves communication between servers and customers. The solution is to create a
system where customers can easily call their servers, increasing overall restaurant
efficiency. This system uses internal wired communication to promptly notify servers
when a customer needs help. It allows servers to focus on their current customers,
saving time and energy spent searching for those in need. Additionally, restaurant
managers can monitor the response time of waiters and waitresses. Hardworking
employees will be recognized, while less motivated ones will be encouraged to
improve. This boosts the restaurant's efficiency, possibly increases morale, and
improves customer satisfaction.

Statement of the Problem

In many popular restaurants, waiters/waitresses often struggle to keep track of all the
tables and attend to customers' requests promptly, especially during busy hours. This
can lead to missed tables and delayed responses, ultimately affecting the overall
clientele and customer satisfaction.

Despite the prevalence of this issue, there is currently no product available in the
market that effectively addresses this communication gap between servers and
customers. This calls for a solution that can significantly enhance communication and
streamline the server-customer interaction to improve the restaurant's efficiency.

24
The Solution

The proposed solution aims to design and implement a system that facilitates seamless
communication between customers and servers, thereby increasing overall efficiency
in the restaurant. One key aspect of this solution is the implementation of an internal
wired communication system that allows customers to easily call their servers
whenever they require assistance. By pressing a dedicated button or using a wireless
device, customers can promptly notify their assigned server about their needs,
ensuring timely service and minimizing wait times.

This system not only benefits the customers but also enables restaurant managers to
monitor the response time of their waiters/waitresses. With real-time data on how
quickly servers attend to customer requests, managers can recognize hardworking and
proficient employees while identifying areas where improvement is needed. This
data-driven approach encourages employees to enhance their performance and
provides opportunities for recognition and reward. As a result, the restaurant becomes
more efficient, staff morale improves, and customer satisfaction levels are elevated.

By implementing this comprehensive communication system, the restaurant can

optimize its operations, ensuring that servers are focused on providing exceptional
service to their assigned customers rather than constantly scanning the dining area for
customers in need. The system creates a streamlined and efficient workflow, allowing
servers to save time and energy while providing personalized and attentive service to
each customer. Ultimately, this solution enhances the overall dining experience,
increases customer satisfaction, and contributes to the success and reputation of the
restaurant.

Aims and Objectives

Now a day, the world is getting into digital world. System was trying to build out to
make people even more convenience on any aspects. Restaurant Management System
provide an system based food ordering system without help of a waiter. It involves
seller and buyer which could bring benefits to each other. It is win-win situation that

25
will bring benefits to the world. This system was bringing a convenience for customer
that can make order by help of a computer.

It provides customer with a completely new way to make order. By providing

customer convenience and also increase the sales. No time wasted with order taking or
letting the customer browse the menu over the system.

This system provides more reliable usability, maintainability and dependability

functions. By creating quality, easy to keep track management of new system. So that
it can streamline all the works by a simple click. By develop the system based food
ordering system can reduce the unnecessary costs such as staff salaries, customer
satisfaction, reputation, etc. Our restaurant also easy to keep track for the maintenance
and point redemption.

Existing system

Today, we will go to a restaurant, then a waiter come and take order. Sometimes the
waiter is busy otherwise he is not see me. And he is not take order as soon as possible.
We will compare Restaurant Management System between, today system come
human errors is possible like can’t take order correctly. We will need to other items
we are waiting for their time.

We can see the speciality of Restaurant Management System we can see the price of
the item in the menu. But today system we can see the total amount we can see at the
last moment. But Restaurant Management System when we take order then we can
see the total amount.

4.2 FEASIBILITY STUDY

A feasibility study of a restaurant management system would typically assess the

viability and practicality of implementing such a system in a restaurant environment.
The study would evaluate various aspects to determine if the system is feasible and
beneficial for the restaurant. Here are some key areas that would be examined:

26
● Technical Feasibility: This involves assessing the technical requirements and
capabilities needed to develop and maintain the restaurant management system.
It would consider factors such as the availability of suitable hardware and
software, required technical skills, integration with existing systems, and
potential challenges in implementation.
● Financial Feasibility: The financial feasibility analysis would evaluate the
costs associated with developing, implementing, and maintaining the restaurant
management system. It would consider factors such as software development
costs, hardware costs, licensing fees, ongoing support and maintenance costs,
and potential return on investment. The study would determine if the benefits
of the system outweigh the costs.
● Operational Feasibility: This aspect examines whether the restaurant
management system aligns with the operational processes and requirements of
the restaurant. It would assess how the system would integrate with existing
workflows, the impact on staff and customers, and any necessary training or
changes in operations required for successful implementation.
● Legal and Regulatory Feasibility: The feasibility study would evaluate any
legal or regulatory requirements that need to be addressed when implementing
the restaurant management system. This may include compliance with data
protection and privacy laws, food safety regulations, and any industry-specific
regulations that may impact the system's development and use.
● Organizational Feasibility: This involves assessing the readiness and
capability of the restaurant's organization to adopt and utilize the management
system effectively. It would consider factors such as the availability of skilled
personnel, potential resistance to change, and the willingness of stakeholders to
embrace the system.
● Time Feasibility: The feasibility study would also assess the time required for
system development, implementation, and training. It would consider any
potential disruptions to restaurant operations during the implementation
process and establish a realistic timeline for the project.

27
By conducting a comprehensive feasibility study, the restaurant can determine if
implementing a management system is a viab¬le option. The study helps identify
potential challenges, risks, and benefits associated with the system, allowing the
restaurant to make an informed decision regarding its implementation.

4.3 LITERATURE REVIEW

The restaurant industry is highly competitive, and efficient management plays a

crucial role in its success. A restaurant management system (RMS) is a
comprehensive software solution designed to streamline operations and enhance
customer experience. This literature review aims to provide an overview of existing
research and studies related to RMS, highlighting its benefits, functionalities, and
impact on restaurant performance.

Numerous studies emphasize the advantages of implementing an RMS in restaurants.

The system helps in automating various tasks, such as order processing, inventory
management, table reservations, and employee scheduling. It improves
communication between front-of-house and back-of-house staff, reduces errors, and
enhances overall operational efficiency.

Furthermore, research indicates that an RMS positively impacts customer experience

and satisfaction. It enables faster order processing, personalized service, and accurate
billing, resulting in improved customer retention and loyalty. Studies have also found
that an RMS facilitates data analysis and reporting, allowing managers to make
informed decisions regarding menu planning, pricing, and resource allocation.

Additionally, the integration of mobile technology and online ordering platforms with
an RMS has gained prominence. This integration provides convenience to customers,
expands reach, and increases revenue opportunities for restaurants.

28
The literature review highlights the significance of an RMS in the restaurant industry.
It improves operational efficiency, enhances customer experience, and provides
valuable insights for managerial decision-making. The findings emphasize the need
for restaurants to adopt an RMS to stay competitive in today's dynamic market.

29
 Chapter-5
PROJECT WORK

5.1 PROPOSED SOLUTION

The proposed solution aims to create a system that enables smooth communication
between customers and servers, leading to improved efficiency in the restaurant. A
key component of this solution is the implementation of an internal wired
communication system, which allows customers to easily call their servers for
assistance. By pressing a designated button or using a wireless device, customers can
quickly notify their assigned server, ensuring timely service and minimizing wait
times.

This system benefits both customers and restaurant managers. Managers can monitor
the response time of servers, enabling them to recognize hardworking employees and
identify areas for improvement. This data-driven approach encourages staff to
enhance their performance and provides opportunities for recognition and rewards. As
a result, the restaurant becomes more efficient, staff morale improves, and customer
satisfaction levels rise.

By implementing this comprehensive communication system, the restaurant can

optimize its operations. Servers can focus on providing exceptional service to their
assigned customers instead of constantly scanning the dining area for assistance. This
streamlines the workflow, saving time and energy while delivering personalized and
attentive service to each customer. Ultimately, this solution enhances the overall
dining experience, increases customer satisfaction, and contributes to the success and
reputation of the restaurant.

5.2 WORKING OF PROJECT

Admin visit the website and can book the table online and can also cancel the booking
if in case required.

30
Admin can add, edit, delete and view the reviews on website. The whole system is
divided into sub-systems, each of which deals with one or more external agents and
which together provide all of functionality of the restaurent system as a whole.

Each user has been give a Username and Password for security reason and using there
account there account customer book a table.

Thus, in the manner the process of booking a table and subscription to news latter is
carried out.

Fig 5.0 Sequence diagram for administrator

Validation and Security :-

The main challenge for online shopping portals is to provide security for the
transactions involved. Customers, usually need to enter their crucial information such
as, credit card number, debit card number etc. to buy products. Today, most of the

31
shopping portals make use of Secured Socket Layer (SSL) to transfer crucial data.
Existing system was capable of

Front-End:-

HTML

HTML is an acronym which stands for Hyper Text Markup Language which is used
for creating web pages and web applications. Let's see what is meant by Hypertext
Markup Language, and Web page.

Hyper Text: HyperText simply means "Text within Text." A text has a link within it,
is a hypertext. Whenever you click on a link which brings you to a new webpage, you
have clicked on a hypertext. HyperText is a way to link two or more web pages
(HTML documents) with each other.

Markup language: A markup language is a computer language that is used to apply

layout and formatting conventions to a text document. Markup language makes text
more interactive and dynamic. It can turn text into images, tables, links, etc.

Web Page: A web page is a document which is commonly written in HTML and
translated by a web browser. A web page can be identified by entering an URL. A
Web page can be of the static or dynamic type.

32
Fig 5.1 Npm install

Fig 5.2 About Js

33
Purpose of this Figure 5.1:

In this figure we creating the folder by using command prompt of app, where the app
will

Purpose of this Figure 5.2:

In this Figure the file we will created by command prompt they were accessed by
Visual Studio to make a app for the project.

Fig 5.3 Index Html

Purpose of this Figure 5.3:

In this Figure the HTML is vary to the Visual Code to understand the whole program
of the App which we start the website of Phonomania.

34
Features of HTML:

• Open source: Easily available on internet so can be downloaded.

• Error – Reporting: Whenever an error occurs in any statement, it is reported at the same
moment. And can be corrected at the same moment.

• Simple: Syntax is easy to remember, learn and understand.

• Platform – Independent: It can run on any operating system without any change in syntax.
LAMP for Linux operating system, WAMP for windows operating system, XAMPP for both
windows and Linux operating system.

• Interpreted: This language is already interpreted. It doesn’t take any extra time for
compilation or interpretation.

CSS

Cascading Style Sheets, fondly referred to as CSS, is a simple design language

intended to simplify the process of making web pages presentable.

CSS handles the look and feel part of a web page. Using CSS, you can control the
color of the text, the style of fonts, the spacing between paragraphs, how columns are
sized and laid out, what background images or colors are used, layout
designs,variations in display for different devices and screen sizes as well as a variety
of other effects.

CSS is easy to learn and understand but it provides powerful control over the
presentation of an HTML document. Most commonly, CSS is combined with the
markup languages HTML or XHTML.

Cascading Style Sheets level 1 (CSS1) came out of W3C as a recommendation in

December 1996. This version describes the CSS language as well as a simple visual
formatting model for all the HTML tags. CSS2 became a W3C recommendation in
May 1998 and builds on CSS1. This version adds support for media-specific style
sheets e.g. printers and aural devices, downloadable fonts, element positioning and
tables.

35
Advantages of CSS

• CSS saves time

• Pages load faster
• Easy maintenance
• Superior styles to HTML
• Multiple Device Compatibility
• Global web standards

Fig 5.4 Index Html 2

Purpose of this Figure 5.4:

In this Figure we use cd Someapp to configure our app folder is on right location or
not so we check it by usingmcd command in Terminal.

36
 Fig 5.5 Index Html 3

5.3 PLANNING

There are two users in this project:

• User ( with limited access )

• Admin ( with full access )

Functions that the user can perform:

• Register

• Login

• Change his / her login password

• Forgot his / her login password

• Manage his profile like phone no, email id, etc.

• View his / her shopping cart

37
Functions:

Manage the products (Add, Update, Delete)

• Order Management System
• User Management, etc

5.4 SOFTWARE DESIGN

PROGRAMMING LANGUAGE - JavaScript is a widely-used programming

language for creating interactive and dynamic web content. It runs on the client side,
enabling the execution of code directly in the web browser. JavaScript allows
developers to add functionality to websites, handle user interactions, manipulate and
modify webpage elements, and perform complex operations. It is known for its
versatility and flexibility, supporting various programming paradigms and providing
access to extensive libraries and frameworks. With JavaScript, developers can create
engaging and interactive web experiences for users.

DATABASE MySQL

MySQL is the most popular database system used with PHP. What is MySQL?

• MySQL is a database system used on the web

• MySQL is a database system that runs on a server
• MySQL is ideal for both small and large applications
• MySQL is very fast, reliable, and easy to use
• MySQL supports standard SQL
• MySQL compiles on a number of platforms
• MySQL is free to download and use
• MySQL is developed, distributed, and supported by Oracle Corporation
• MySQL is named after co-founder Monty Widenius's daughter: My

38
The data in MySQL is stored in tables. A table is a collection of related data, and it
consists of columns and rows.

DEVELOPMENT SOFTWARE

Macromedia Dreamweaver 8

Macromedia Dreamweaver 8 is a professional HTML editor for designing, coding,

and developing websites, web pages, and web applications. Whether you enjoy the
control of hand-coding HTML, or prefer to work in a visual editing environment,
Dreamweaver provides you with helpful tools to enhance your web creation
experience. This guide introduces you to using Macromedia Dreamweaver 8 if you’re
unfamiliar with any major aspect of it. The tutorials in this guide lead you through the
process of creating a simple but functional website.

The visual editing features in Dreamweaver let you quickly create web pages without
writing a line of code. You can view all your site elements or assets and drag them
from an easy-to-use panel directly into a document. You can streamline your
development workflow by creating and editing images in Macromedia Fireworks or
another graphics application, and then import them directly into Dreamweaver.
Dreamweaver also provides tools that make it easy to add Flash assets to web pages.

In addition to drag-and-drop features that help you build web pages, Dreamweaver
provides a full-featured coding environment that includes code- editing tools (such as
code coloring, tag completion, a coding toolbar, and code collapse) and language
reference material on Cascading Style Sheets (CSS), JavaScript, ColdFusion Markup
Language (CFML), and other languages. Macromedia Roundtrip HTML technology
imports your hand-coded HTML documents without reformatting the code; you can
then reformat code with your preferred formatting style. Dreamweaver also lets you
build dynamic, database-driven web applications using server technologies such as
CFML, ASP.NET, ASP, JSP, and PHP. If your preference is for working with XML
data, Dreamweaver provides tools that let you easily create XSLT pages, attach XML
files, and display XML data on your web pages. Dreamweaver is fully customizable.

39
You can create your own objects and commands, modify keyboard shortcuts, and
even write JavaScript code to extend Dreamweaver capabilities with new behaviors,
Property inspectors, and site reports.

Notepad++

Notepad++ is a free source code editor and notepad replacement that support several
languages. Running in the MS windows environment, Its use is governed by GPL
license. Based on a powerful editing component scintilla. Notepad++ is written in C+
+ and uses pure win32 API and SLT which ensure a higher execution speed and
smaller program size.

Notepad is a full featured text editor with features like syntax high lighting and syntax
folding like HTML,ASP,JAVA,CSS and PHP etc.

Firefox/Google Chrome

Firefox and Google Chrome is used to testing the web pages. And both browsers are
used to search for more information to do this project.

5.5 ORGANISATION STRUCTURE

Fig 5.6 Organization structure

40
As the above diagram shows, it shows how the system architecture/structure is going
to look like. It has one admin access which will acts as root and the main
communication center. This site have multiple customer so it has customer window.
Apart from customer window, the one who has admin access it has two more window
Delivery Management and Kitchen Management which will take care of backend
activities for the Restaurant.

5.6 CODE SNIPPETS

In this section all the snapshots related to the code is pasted along with the folder
structure. This sections also gives us the whole Project implementation.

Code Snippets

Fig 5.7 Folder structure

41
 Fig 5.8 Frontend package.json

Fig 5.9 Frontend package-lock.json

42
Fig 5.10 App.js

Fig 5.11 Index.Js

43
Fig 5.12 commentBox.Js

Fig 5.13 comment.Js

44
Fig 5.14 Home.Js

Fig 5.15 login.Js

45
Fig 5.16 Menu.Js

46
5.7 SYSTEM DESIGN

System design for customer interaction.

Fig 5.17 System design

47
For giving the order, the user should become a member initially. User would have to
install his information like the address and other key information so that he doesn’t
have to give his information each time. For signing up every customer has to give
some his details such as address, name, Contact no etc and the most important is email
ID which is the primary key to identify each customer uniquely, thus email becomes
the User ID for the customer.The only thing needed here is to sign in to the system
through the system.

Now he would have the option to edit his current information and big thing to order
the food diminishing the human interaction. He would have today’s menu in front of
him and he have the clear choices for order. He hasvariety of things to do here and
have the option to cancel the order before the serving. For the first time to access the
system, customer has to give his key information like identification and so on. For the
management side, it is quite possible to book many orders concurrently. System will
be able to book nearly infinite number of orders at a time.

Management side has more updated information and they can get the currently orders.
System will be able to deal with the customers who don’t come to take there orders by
blocking them and not letting them to signup again. This is done by maintaining some
information regarding the status of order and the relative customer. So according to
that the system can deal him. How system deals with him..? He should have to pay the
amount of the last order in order to continue with his membership. All that would be
implemented in Apache Server Pages and MySQl Servlets.At Login page we will be
checking the user’s existence and mapping his user ID/email ID with his password, if
the user is valid then he is allowed to access further.At Registration, it is checked that
the user ID/ email ID is not pre- existening, along with various general events/acts
such as the customer had entered right format of the e-mail, or it is not entered NIL,
all phone & mobile numbers contain only the numbers, etc.

The option of password reminder is also included, so that when the user forgets his
password then he can get a new password by giving his email ID, only if he already
exists.

48
5.8 ER DIAGRAM

Fig 5.18 ER diagram

49
Customer Info

This table keeps the record of the customer’s information before user logs on he fills up a
form that guides him how he can become a member. Email ID is primary key in this table so
we can recognize each member’s email ID uniquely as it is used as their user ID as well.
Other information includes customer Name, password, contact no, Address and status, the
later tells him about whether the member is blacklisted or locked. The entity shares a 1:N
relation with order utilities.,

Menu

The name insists, it contains the information of all menus and its related matter. Each menu is
uniquely identified by its Item ID (Primary key). The purpose here is to provide customers all
the information regarding menu such as Name (item), Description, Category, price and status
(to check customer, whether that item is currently available or Not!!). Later, at the
management’s point of view, we provide user ID (uniquely selected by management staff) to
alter the contents of table. This entity shares N:1 relationship with the ordered item entity.

Ordered Item

This table provides information to the management staff regarding the uniquely generated
order ID, which may contain one or more menu item uniquely identified by Item ID. Apart
from this, the management can check/alter the status of the order along with, they can alter
the cook/s which was previously assigned to fulfill the order, this can be done by the
management staff by logging in with User ID.

A cook can place status over this entity regarding the status of the specified item is ready for
delivery or not !!, this is done by using uniquely provided cook ID. From customer’s
perspective, customer can check the status of his order in detail i.e. the status of each item in
his order from this table as well as the quantity he ordered, the later can also be helpful at the
management side. This entity shares 1: N relationship with the Menu table

Order

This table tells about the Order ID (which is a primary key), who has placed the order and
gives details about the time when order was placed and the time when the order will be
delivered; along with the status of the order (usually some 5 status labels are assigned). This
table shares N:1 relationship with the Customer info entity.

50
5.9 DATA DIRECTORY

Data Directories area is where you maintain a list of directories that can be used by
the data loading and MVSD services on the server to index and load data, and
optionally, receive and store files transmitted Download.

Fig 5.19 ADMIN TABLE

51
 Chapter-6
RESULTS AND DISCUSSION

6.1 RESULTS

The Project is successfully perform all activities and operations. It has its own window
working for admin access and also for the Customer access. It is performing all the crud
operations with the limited period of time and the lagging of the loading and routing to the
other page is also very less.

6.2 RESULTS SCREENSHOTS

ScreenDesign

Fig 6.1 Login page

This page is contain login into home/main page. Login done by entering a unique
Username and Password. If the user is not registered then he/she have to signup first
otherwise have to login it.

52
 Fig 6.2 Dashboard

This menu contain the ordered list and add order button. The order list page show all
the order ordered by customer. They can enable view/delete order by pressing the
corresponding buttons. They also delete the order/cancel transaction.

Fig 6.3 Dashboard 2

53
This page has also show all the food item which can view by category. It allows
customers to order food and select quantity and add it to order list. Customer can view
their order in dashboard.

Fig 6.4 view or edit page

Fig 6.5 add customer page

54
 Chapter-7
CONCLUSION AND FUTURE SCOPE

7.1 FUTURE SCOPE OF THE PROJECT

The main dispatcher system software, while functional, has some areas that can be
enhanced in the future to improve its overall efficiency and security. Currently, the
system allows unrestricted access to view and modify the database, which poses a
potential security risk. Implementing user profiles with password authentication
would add an extra layer of security, ensuring that only authorized personnel can
access and modify the system.

In terms of usability and readability, incorporating eccentric features such as

color-coded indicators for different request statuses, request types, or waiter IDs
would greatly enhance the visual representation of the request table. This would make
it easier for dispatchers to quickly identify and prioritize pending requests, leading to
improved efficiency and faster response times.

Looking ahead, integrating the main dispatcher software with the existing ordering
software used by restaurants would be a highly beneficial development. This
integration would streamline the overall workflow and increase productivity by
enabling seamless communication between the dispatcher system and the ordering
software. For example, when a new order is placed through the ordering software, it
could automatically generate a corresponding request in the dispatcher system,
eliminating the need for manual data entry and reducing the chances of errors or
delays.

By joining these two software systems, restaurants can achieve greater operational
efficiency, minimize duplicate data entry, and ensure smoother coordination between

55
the front-of-house and back-of-house operations. This integration would ultimately
contribute to faster order processing, improved customer service, and enhanced
overall productivity for the restaurant.

Summarizing, there are several areas for potential improvement in the main dispatcher
system software. Strengthening security through user profiles and passwords,
implementing visual enhancements like color-coded indicators, and integrating with
existing ordering software are all steps that can enhance efficiency, usability, and
productivity in restaurant operations.

7.2 CONCLUSION

The wireless restaurant management system has been developed with the aim of
enhancing worker efficiency and maximizing the profit margin for restaurant owners
by providing improved service. By utilizing a system that enables prompt response to
customer needs and by collecting valuable data through the Main Dispatcher, the
restaurant can achieve these goals effectively.

However, the project encountered challenges that were larger than initially
anticipated. The lack of manpower and delays in receiving necessary parts prolonged
the development process. As a result, certain functionalities had to be abandoned or
temporarily set aside in order to meet the project's time constraints.

It's important to note that the wireless restaurant management system is not intended
to replace the existing ordering systems commonly used in many restaurants. Instead,
it is designed to complement and enhance the capabilities of those systems. By
integrating seamlessly with the existing infrastructure, the system can provide
additional features and functionalities that contribute to improved overall efficiency
and customer service.

56
Moving forward, as the Restaurant Management System undergoes further refinement
and incorporates the ideas discussed in the previous section, it has the potential to
become an indispensable tool for restaurant operations. By addressing the challenges
faced during development and incorporating valuable feedback, the system will
continue to evolve and offer increased benefits to both workers and restaurant owners.
It will facilitate smoother operations, optimize resource utilization, and ultimately
contribute to a better dining experience for customers while maximizing profitability
for the establishment.

57
 REFERENCES

[1] Smith, J., & Johnson, A. (2019). The Impact of Restaurant Management Systems on
Operational Efficiency and Customer Satisfaction. Journal of Hospitality and
Tourism Technology,10(3),432-448.
[Link to the article: https://doi.org/10.1108/JHTT-01-2019-0016]

[2] FOR HTML

https://developer.mozilla.org/en-US/docs/Web/HTML
https://www.w3schools.com/html/
FOR CSS
https://www.w3schools.com/html/html_css.asp
https://developer.mozilla.org/en-US/docs/Web/CSS
FOR JAVASCRIPT
https://www.javascript.com/
https://developer.mozilla.org/en-US/docs/Web/JavaScript
FOR MySQL
https://www.mysql.com/
https://www.w3schools.com/MySQL/default.asp

[3] Praveen, M. and Harini, V., 2019, March.. In 2019 International Conference on Smart
Structures and Systems (ICSSS) (pp. 1-5). IEEE.

58