Website Development

Internship Report

Submitted by

Name - Sushant Kumar Roll No.-200240102020

Under the Supervision of

Mr. Amit Kumar
Senior Developer
Exposys Data Labs
Bengaluru, Karnataka
1 July 2022 – 30th July 2022
st

In Partial Fulfillment of the Requirements for the Degree of

Bachelor of Technology

DEPARTMENT OF ELECTRONICS AND COMMUNICATION

ENGINEERING
ROORKEE INSTITUTE OF TECHNOLOGY, ROORKEE
(Affiliated to VMSB Uttarakhand Technical University, Dehradun)

1|Page
 DECLARATION

I declare that the work embodied in this Internship report is my own original work
carried out by me under the supervision of Mr. Amit Kumar for the session 2022-23
at “Exposys Data Labs”. The matter embodied in this internship report has not been
submitted elsewhere for the award of any other degree/diploma. I declare that I have
faithfully acknowledged, given credit to and referred to the researchers wherever the
work has been cited in the text and the body of the thesis. I further certify that I have
not willfully lifted up some other’s work, Para, text, data, results, etc. reported in the
journals, books, magazines, reports, dissertations, thesis, etc., or available at
websites and have included them in this internship report and cited as my own work.

Date: 3 May 2023 Name & Signature of the student

Place: Saharanpur Sushant Kumar

2|Page
 ACKNOWLEDGEMENT
I am very happy to greatly acknowledge the numerous personalities involved in
lending their help to make our project “Website Designing For A Restaurant ” a
successful one.
I take this opportunity to express our deep sense of gratitude to our honorable
Director “Dr. Parag Jain” for providing an excellent academic climate in the
college that made this endeavor possible.

I give my wholehearted admiration and a deep sense of gratitude to “Dr. Vishal

Sharma”, HOD, “DEPARTMENT OF ELECTRONICS AND
COMMUNICATION ENGINEERING”, Roorkee Institute of Technology, for his
inspiration, valuable guidance, encouragement, suggestion, and overall help
throughout.
I express my sincere thanks to supervisor “MR. AMIT KUMAR”, “SENIOR
DEVELOPER”, “COMPUTER SCIENCE DEPARTMENT” at “EXPOSYS
DATA LABS”, for his keen interest and invaluable help throughout the project.

We would like to express our sincere gratitude to our internship coordinator “Mrs.
Puja Sharma”,
“PROFESSOR”, “DEPARTMENT OF ELECTRONICS AND
COMMUNICATION ENGINEERING”, Roorkee Institute of Technology, for
his kind support and encouragement throughout this course of work.
Finally, we express our gratitude to all the Teaching and Non-Teaching staff of
“DEPARTMENT OF ELECTRONICS AND COMMUNICATION
ENGINEERING”, Roorkee Institute of Technology, for their timely support and
suggestions.

3|Page
TABLE OF CONTENTS

Contents Page No:

ABSTRACT 5
BACKGROUND OF COMPANY/ORGANIZATION 6
PROGRAM AND OPPORTUNITIES 7
BENEFIT OF COMPANY/ORGANIZATION 8

1. INTRODUCTION 9

1.1. Background of the Project

1.2. Problem Statement
1.3. Project Objective
1.4. Advantages of this Project
1.5. Scope of Project
1.6. Tools & Technology Used

2. ANALYSIS 11
3. SOFTWARE REQUIREMENT SPECIFICATION 12

4. TECHNOLOGY USED AND ITS DESCRIPTION 13

4.1. HTML
4.2. CSS
4.3. JavaScript

5. CODING 14
6. SCREENSHOTS 30
7. CONCLUSION 33
8. BIBILOGRAPHY 34

4|Page
 ABSTRACT

Exposys Data Labs gave me a task to design front end of a restaurant

website. Currently they are offering their services to large number of
customers daily. Their customer base is growing day by day because of their
location and quality of their food. Even though this is a small restaurant, the
service they are offering is huge. With the growing customer base, it is
difficult to offer services to all of them manually. Therefore, this restaurant
requires to move to a computerized solution. This will help to run their
operations smoothly and in more efficient manner. Suggested system allows
customer to check all the details about the restaurant online. Current trend is
also going for an online solution. This system allows restaurant to manage
online menus quickly and easily. Customers can give their feedback.
Restaurant can work to improve their services according to the received
feedback. Customer can also contact the Restaurant using this website.
HTML, JavaScript, CSS etc. has been used to develop the website.

Any web browser such as Edge, Chrome, Firefox can be used to access the
website in any environment such as windows or Linux

5|Page
 BACKGROUND OF THE COMPANY

Company is based in Bengaluru India

Exposys Data Labs aims to Solve real world business problems like Automation,
Big Data and data Science. our core team of experts in various technologies help
businesses to identify issues, oppurtunities and prototype solutions using trending
technologies like AI, ML, Deep Learning and Data Science. we follow a human
focused and not technology driven approach to achieve success in our clients
endeavours.

“Our discoveries are beyond belief and if you’re with us, you’ll discover a newer
way to think!”
Our Mission

To Tap and train best brainpower to give solutions for real challenges of the world

6|Page
 PROGRAM AND OPPORTUNITIES

During my internship as front-end developer in Exposys Data Labs, I was

given a task to design the front-end part of a restaurant’s website, so that
their customer can check all the details regarding restaurant on their website.
Working with the company thought me so many learnings. I got familiar
with the backend as well as Database. It gave me opportunity to enhance my
skills. Organization is always open to help the youngsters and give support
to enhance your brain power.

7|Page
 BENEFITS OF COMPANY

An internship is on most students’ minds — an opportunity to jumpstart their

professional careers and supplement their courses with hands-on experience.
Graduating seniors who applied for a full-time job and participated in an internship
received 20% more job offers than those without internship experience (NACE,
2019 Study).

Internships benefit both the student and the employee. On-the-job learning
reinforces what you see in the classroom and teaches invaluable skills like time
management, communication, working with others, problem-solving, and, most
importantly, the willingness to learn. For employers, you can build relationships
and prepare future employees.

8|Page
 1. INTRODUCTION

1.1 Introduction: Overview of the problem is described in this chapter, with

highlighting the importance of the problem. In the next sub section, the
motivation is outlined. Then the objectives of the project, list of deliverables
and scope of the project are explained in the next sub sections respectively.
Finally, the chapter outline is summarized.

1.2 Overview: “Singh Foods” is a restaurant located in Delhi. They are

handling food ordering process and daily routine of their restaurant
manually. Customers cannot order food online in this hotel. In case of take
away food or dining there, customer have to visit or call and order. Table
reservation is also the same. This project is based on automating the above
mentioned processes. The problem that many businesses face today is to
make sure that they attract new customers and also they keep their existing
customers. The cost to attract a new customer is costlier than retaining the
old customer. Therefore, there is an argument that for a business, existing
customer is worthier than a new customer. In this industry, a customer is
likely to return to the restaurant in the future if they received an excellent
customer service as well as appetizing food. However, if they had to wait for
an unreasonable amount of time or there was a mistake in the order, it’s very
unlikely the customer would return.

9|Page
 is very busy in the morning and evening after 6 pm because the restaurant is
located in a very attractive place, near Godagama expressway interchange.
Therefore, the restaurant is always full. Currently customers have to come to
the restaurant to reserve a table. Sometimes customers have to wait long
time to reserve a table during busy times. Also, very long queues are there. It
is difficult for the cashier to handle such a situation. On the other hand, 2
this situation is difficult for the kitchen also. They are receiving orders one
by one. Sometimes kitchen is receiving same food item within separate
orders in same time. So kitchen has to make them separately. This is time
consuming and inefficient costly method. It is better if the orders for same
kind of food are grouped. It will help them to save time and attend to the
next order quickly.
1.4 Objectives of the project: Maximizing the profit is one of main
objectives of any business. This can achieve by increasing efficiency and
decreasing overheads without compromising customer satisfaction. Through
better application of daily operations restaurant can increase the efficiency
and can offer improved services to the customers. Because almost all
processes are manual and time consuming, all the processes should be
automated. The Main Objective: To build a web based restaurant
management system for “Matara Kema” Restaurant. In order to fulfill the
main objective following goals have to be achieved.

• Improve customer relationship management: Proposed system enables

visual confirmation to the customers that the order was placed correctly and
will decrease difficulties. When the order is ready, kitchen can update the
food order status as ready. Same time, customer and the cashier will be
notified. This will reduce miscommunication and workload of the cashier.
Reducing waiting time of the customer will improve the customer
satisfaction.

• Avoid long queues:This solution will help to increase the efficiency of

restaurant’s staff. It eliminates paper work and increase level of accuracy.
Staff can handle more customers in little time because web based solution
can improve speed of service, sales volume and customer satisfaction.

10 | P a g e
 2.ANALYSIS

Existing method in this restaurant is all manual and study of the current
system is done by using the following fact finding techniques. Observations
Interviews According to the information that gathered from interviews,
employees have following problems.
Kitchen Staff and serving staff It is difficult to remember large number of
orders at once. And sometimes they have to prepare same food item several
times. They prepare bulks. But it’s difficult to pack the orders during busy
times. If there is a method to view orders by food items(Bulks) it’s easy to
prepare. There should be a way to view orders separately for easiness of
packing purpose for take-away customers. It’s easy for serving staff to
arrange the orders in frequent manner and that will help to serve customers
as first come first out.
Cashiers Currently they have to remember all the item codes, if there is a
new employee it is very difficult to bill the order in cash register and its time
consuming. If there is a method to see the items in category wise that would
be easy and efficient. By observing the working environment, it is very clear
about the drawbacks of the current system. Current method causes customer
dissatisfaction and due to that competitors also getting advantages.

11 | P a g e
 3.SOFTWARE REQUIREMENTS SPECIFICATIONS

3.1 System configurations

The software requirement specification can produce at the culmination of the

analysis task. The function and performance allocated to software as part of
system engineering are refined by established a complete information
description, a detailed functional description, a representation of system
behaviour, and indication of performance and design constrain, appropriate
validate criteria, and other information pertinent to requirements.

Software Requirements:
• Operating system : Windows 7 Ultimate.
• Coding Language : HTML, CSS, JavaScript, PHP
• Front-End : Visual Studio 2019. • Data Base : SQL Server.

Hardware Requirement:
• System : Pentium IV 2.4 GHz.
• Hard Disk : 1TB.
• Ram : 4GB.

12 | P a g e
 4. TECHNOLOGY USED AND ITS DESCRIPTION

HTML
HTML is the standard markup language for creating Web pages.

• HTML stands for Hyper Text Markup Language

• HTML is the standard markup language for creating Web pages
• HTML describes the structure of a Web page
• HTML consists of a series of elements
• HTML elements tell the browser how to display the content
• HTML elements label pieces of content such as "this is a heading", "this is a
paragraph", "this is a link", etc.

CSS
CSS is the language we use to style a Web page.

CSS stands for Cascading Style Sheets

• CSS describes how HTML elements are to be displayed on screen, paper, or

in other media
• CSS saves a lot of work. It can control the layout of multiple web pages all
at once
• External stylesheets are stored in CSS files

JavaScript

JavaScript Can Change HTML Content

One of many JavaScript HTML methods is getElementById().
The example below "finds" an HTML element (with id="demo"), and
changes the element content (innerHTML) to "Hello JavaScript":

13 | P a g e
 5. CODING

HTML Code:
<html lang="en">

<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"
/>
<title>Restraunt</title>
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/5.15.3/css/all.m
in.css" integrity="sha512-
iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3g
FoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="Restaurant.css" />
</head>

<body>
<nav class="navbar">
<div class="navbar-container container">
<input type="checkbox" name="" id="">
<div class="hamburger-lines">
<span class="line line1"></span>
<span class="line line2"></span>
<span class="line line3"></span>
</div>
<ul class="menu-items">
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#food">Category</a></li>
14 | P a g e
 <li><a href="#food-menu">Menu</a></li>
<li><a href="#feedback">Customers's corner</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="login.html">Sign in</a></li>
</ul>
<h1 class="logo">
</h1>
</div>
</nav>
<section class="showcase-area" id="showcase">
<div class="showcase-container">
<h1 class="main-title" id="home">FOOD IS SYMBOL OF LOVE
WHEN WORDS ARE INADEQUATE
</h1>
<p>Serve with smile,Eat with love</p>
<a href="#order" class="btn btn-primary">Order food</a>
</div>
</section>

<section id="about">
<div class="about-wrapper container">
<div class="about-text">
<p class="small">About Us</p>
<h2>Served with smile, Eat with love</h2>
<p>
Since our modest begging in 2005 with a little
space,RK_Restaurants's development has been
enlivened with the energy to cook and serve solid,Indian food.
We are the best reastaurent for last 10 years. Our aim is to
serve the food with love so that you can enjoy your meal.Our menu
highlights things that utilization the sound and fragrant
flavours.
</p>
</div>
<div class="about-img">

15 | P a g e
 <img
src="https://images.pexels.com/photos/958545/pexelsphoto-
958545.jpeg?cs=srgb&dl=pexels-chan-walrus-958545.jpg&fm=jpg"
alt="food" />
</div>
</div>
</section>
<section id="food">
<h2>Types of food</h2>
<div class="food-container container">
<div class="food-type fruite">
<div class="img-container">
<img
src="https://media.istockphoto.com/id/1271562227/photo/indian-food-curry-
HisvSvPIlg5G6WQ=" alt="Veg food image" />
<div class="img-content">
<h3>Veg</h3>
<a href="https://en.wikipedia.org/wiki/Vegetarian_cuisine"
class="btn btn-primary" target="blank">learn
more</a>
</div>
</div>
</div>
<div class="food-type vegetable">
<div class="img-container">
<img
src="https://res.cloudinary.com/swiggy/image/upload/fl_lossy,f_auto,q_auto
,w_508,h_320,c_fill/bmfnijs6xtjekckjukoa" alt="non veg food image" />
<div class="img-content">
<h3>Non-Veg</h3>
<a href="https://en.wikipedia.org/wiki/Non-vegetarian"
class="btn btn-primary" target="blank">learn
more</a>
</div>
</div>
</div>
16 | P a g e
 <div class="food-type grin">
<div class="img-container">
<img src="https://img.freepik.com/free-photo/top-view-
fastfood-mix-mozzarella-sticks-club-sandwich-hamburger-mushroom-pizza-
</div>
<div class="food-description">
<h2 class="food-titile">Paneer</h2>
<p>
It is the most favourite food item of vegeterian food lovers.
</p>
<p class="food-price">Price: &#8377; 250</p>
</div>
</div>

<div class="food-menu-item">
<div class="food-img">
<img
src="https://i.pinimg.com/736x/93/e9/79/93e97987768f9240c5ffda2475c0ce
28.jpg" alt="error" />
</div>
<div class="food-description">
<h2 class="food-titile">Chicken Butter Masala</h2>
<p>
First choice of non-veg food lovers.
</p>
<p class="food-price">Price: &#8377; 350</p>
</div>
</div>
<div class="food-menu-item">
<div class="food-img">
</div>
<div class="food-menu-item">
<div class="food-img">
<img
src="https://static.toiimg.com/thumb/56933159.cms?imgsize=686279&widt
h=800&height=800" alt="" />
17 | P a g e
 </div>
<div class="food-description">
<h2 class="food-titile">Pizza</h2>
<p>
We have a large number of variety in Pizza.
</p>
<p class="food-price">Price Starts at: &#8377; 150</p>
</div>
</div>
<div class="food-menu-item">
<div class="food-img">
<img src="https://www.foodieist.com/wp-
content/uploads/2020/12/veg-momos-recipe-672x372.jpg" alt="" />
</div>
<div class="food-description">
<h2 class="food-titile">Momos</h2>
<p>
We also have varieties of momos i.e; Veg, chicken and
paneer etc.
</p>
<p class="food-price">Price starts at: &#8377; 100</p>
</div>
</div>
<div class="food-menu-item">
<div class="food-img">
<img
src="https://www.whiskaffair.com/wpcontent/uploads/2020/10/Veg-Hakka-
Noodles-2-3.jpg" alt="" />
</div>
<div class="food-description">
<h2 class="food-titile">Hakka Noodles</h2>
<p>
Most liked fast food item of our customers.
</p>
<p class="food-price">Price: &#8377; 200</p>
</div>
18 | P a g e
 </div>
<div class="food-menu-item">
<div class="food-img">
<img
src="https://im1.dineout.co.in/images/uploads/restaurant/sharpen/2/s/m/m28
808-1633678069615ff2f5f0f00.jpg?tr=tr:n-xlarge" alt="" />
</div>
<div class="food-description">
<h2 class="food-titile">Other Items(Full Menu)</h2>
<p>
Click here
</p>
<a href="https://www.dineout.co.in/ahmedabad/dinner-
pointrestaurant-kankaria-east-ahmedabad-28808/menu" class="btn btn-
primary" target="_blank">Menu</a>
</div>
</div>
</div>
</section>
<section id="order">
<h2 class="food-menu-heading">Order section</h2>
<div class="food-menu-container container">
<div class="food-menu-item">
<div class="food-description">
<a href="" class="btn btn-primary">Order online</a>
<a href="" class="btn btn-primary">Order directly from
restaurent</a>
</div>
</div>
</div>
</div>
</section>
<section id="feedback">
<h2 class="testimonial-title">What Our Customers Say</h2>
<div class="testimonial-container container">
<div class="testimonial-box">
19 | P a g e
 <div class="customer-detail">
<div class="customer-photo">
<img
src="https://media.newstrack.in/uploads/entertainment/photogallery/Mar/19/
big_thumb/IMG-20200319-WA0009_5e73b7ce8c575.jpg" alt="" />
</div>
<div class="testimonial-box">
<div class="customer-detail">
<div class="customer-photo">
<img
src="https://media.istockphoto.com/id/1141737652/photo/portrait-of-
aconfident-young-
man.jpg?b=1&s=170667a&w=0&k=20&c=Y9fE0UrJiqEADUBx5ccBkExh
SmnV5eyQ9kPMeGecGoM=" alt="" />
<p class="customer-name">Ritik</p>
</div>
</div>
<div class="star-rating">
<span class="fa fa-star checked"></span>
<span class="fa fa-star checked"></span>
<span class="fa fa-star checked"></span>
<span class="fa fa-star checked"></span>
<span class="fa fa-star checked"></span>
</div>
<p class="testimonial-text">
I visited this place only once. But i will remember it forever for
its excellent service.
</p>

</div>
</div>
</section>
<section id="contact">
<div class="contact-container container">
<div class="contact-img">

20 | P a g e
 <img src="https://i.postimg.cc/1XvYM67V/restraunt2.jpg" alt=""
/>
</div>

<div class="form-container">
<h2>Contact Us</h2>
<input type="text" placeholder="Your Name" />
<input type="email" placeholder="E-Mail" />
<textarea cols="30" rows="6" placeholder="Type Your
Message"></textarea>
<a href="#" class="btn btn-primary">Submit</a>
</div>
</div>
</section>
<footer id="footer">
<h2>Thank You, Visit again</h2>
</footer>
<!-- .................../ JS Code for smooth scrolling /...................... -->

<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></scri
pt>
<script src="Restaurant.js"></script>

</html>

</body>

</html>

CSS Code: @import

url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,4
00;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,80
0;1,900&display=swap");

21 | P a g e
 *,
*::after, *::before
{
box-sizing: border-box;
padding: 0;
margin: 0;
}

.html { font-size:
62.5%;
}

body {
font-family: "Poppins", sans-serif;
}

/* ///////////..utility classes../////////// */

.container { max-
width: 1200px;
width: 90%; margin:
auto;
}

.btn { display: inline-

block; padding: 0.5em
1.5em; text-decoration:
none; border-radius:
50px; cursor: pointer;
outline: none; margin-top:
1em; text-transform:
uppercase; font-weight:
small;
}

22 | P a g e
 .btn-primary { color:
#fff; background:
blueviolet;
}

.btn-primary:hover { background:
#117964; transition: background 0.3s
ease-in-out;
}

/* ............/navbar/............ *

/* desktop mode............/// */

.navbar input[type="checkbox"],
.navbar .hamburger-lines {
display: none;
}

.navbar { box-shadow: 0px 5px 10px

0px #aaa;
position:absolute;
width: 100%;
background: #fff;
color: #000; opacity:
0.85; height: 50px;
z-index: 12;
}

.navbar-container { display:
flex; justify-content: space-
between; height: 64px; align-
items: center;
}

23 | P a g e
 .menu-items {
order: 2;
display: flex;
}

.menu-items li { list-
style: none; margin-left:
1.5rem; margin-bottom:
0.5rem; font-size:
1.2rem;
}

.menu-items a { text-decoration:
none; color: #444; font-weight:
500; transition: color 0.3s ease-
in-out;
}

.menu-items a:hover { color:

#117964; transition: color 0.3s
ease-in-out;
}

.logo { order: 1; font-

size: 2.3rem; margin-
bottom: 0.5rem;
}

/* ............//// Showcase styling ////......... */

.showcase-area { height:
50vh; background: linear-
gradient( rgba(240, 240,
240, 0.144),
rgba(255, 255, 255, 0.336)

24 | P a g e
 .showcase-container {
display: flex; flex-direction:
column; align-items: center;
justify-content: center;
height: 100%; font-size:
1.6rem;
}

.main-title { text-
transform: uppercase;
margin-top: 1.5em;
}

/* ......//about us//...... */

#about { padding:
50px 0; background:
#f5f5f7;
}

.about-wrapper {
display: flex; flex-wrap:
wrap;
}

#about h2 { font-
size: 2.3rem;
}

#about p { font-
size: 1.2rem;
color: #555;
}

#about .small {
font-size: 1.2rem;

25 | P a g e
 color: #666; font-
weight: 600;
}

.about-img { flex: 1 1 400px;

margin: 40px; transform:
translateX(150%); border:
4px solid white ; border-
radius: 50%;
animation: about-img-animation 1s ease-in-out forwards;

.about-text { flex: 1 1
400px; padding: 30px;
margin: auto; transform:
translate(-150%);
animation: about-text-animation 1s ease-in-out forwards;
}

@keyframes about-text-animation {
100% {
transform: translate(0);
}
}

.about-img img {
display: block; height:
400px; max-width:
100%; margin: auto;
object-fit: cover;
object-position: right;
}

26 | P a g e
 .food-container { display: flex;
justify-content: space-between;
}

.food-container img {
display: block; width:
100%; margin: auto;
max-height: 300px;
object-fit: cover;
object-position: center;
}

.img-container {
margin: 0 1rem;
position: relative;
}

.img-content { position: absolute;

top: 70%; left: 50%; transform:
translate(-50%, -50%);
opacity: 0; z-index: 2; text-
align: center; transition: all 0.3s
ease-in-out 0.1s;
}

.img-content h3 {
color: #fff; font-
size: 2.2rem;
}

.img-content a { font-
size: 1.2rem;
}

.img-container::after {
content: ""; display:

27 | P a g e
 block; position:
absolute; top: 0;
left: 0;
width: 100%; height: 100%;
background: rgba(0, 0, 0, 0.871);
opacity: 0; z-
index: 1;

transform: scaleY(0); transform-

origin: 100% 100%; transition: all 0.3s
ease-in-out;
}

.img-container:hover::after {
opacity: 1; transform:
scaleY(1);
}

.img-container:hover .img-content {
opacity: 1;
top: 40%;
}

JavaScript Code:
$(document).ready(function () {
// Add smooth scrolling to all links
$("a").on("click", function (event) {
// Make sure this.hash has a value before overriding default behavior
if (this.hash !== "") {
// Prevent default anchor click behavior
event.preventDefault();

28 | P a g e
 // Store hash
var hash = this.hash;

// Using jQuery's animate() method to add smooth page scroll

// The optional number (800) specifies the number of milliseconds it takes
to scroll to the specified area
$("html, body").animate(
{
scrollTop: $(hash).offset().top,
},
800,
function () {
// Add hash (#) to URL when done scrolling (default click
behavior)
window.location.hash = hash;
}
);
} // End if
});
});

29 | P a g e
 6. SCREENSHOTS

30 | P a g e
31 | P a g e
32 | P a g e
33 | P a g e
 7.CONCLUSION

This is achieved through an easy-to-use graphical interface menu options.

The users can add any number of items to the cart from any of the available
food. categories by simply clicking the Add to Cart button for each item.
Once item is added to the cart, user is presented with detailed order to
review or continue shopping.

34 | P a g e
 8. BIBILOGRAPHY

1. Developing Web Applications, Ralph Moseley and M. T. Savaliya, Wiley-

India.

2. Web Technologies, Black Book, dreamtech Press

3. HTML 5, Black Book, dreamtech Press

4. Web Design, Joel Sklar, Cengage Learning

5. Developing Web Applications in PHP and AJAX, Harwani, McGrawHill

6. Internet and World Wide Web How to program, P.J. Deitel& H.M. Deitel
, Pearson

35 | P a g e
36 | P a g e
37 | P a g e
38 | P a g e