Scribd
Upload
3 views

Report Swpd[1]

The document is a project report on the development of an 'Online Restaurant Website' aimed at improving restaurant management and customer experience through online ordering and reservations. It outlines the website's structure, including key pages such as Home, About Us, Order Now, and Reviews, along with the benefits of using restaurant management systems. The report also includes code snippets for the website's various functionalities, emphasizing automation and user engagement.

Uploaded by

Aayushi Mandaliya
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
3 views

Report Swpd[1]

The document is a project report on the development of an 'Online Restaurant Website' aimed at improving restaurant management and customer experience through online ordering and reservations. It outlines the website's structure, including key pages such as Home, About Us, Order Now, and Reviews, along with the benefits of using restaurant management systems. The report also includes code snippets for the website's various functionalities, emphasizing automation and user engagement.

Uploaded by

Aayushi Mandaliya
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 23

RESTAURANTMANAGEMENT

A
PROJECT
REPORT
ON
MINI
PROJECT
ENTITLED
“RESTURANT WEBSITE”
SUBMITTED BY

MEMBER1 MANDALIYA AAYUSHI D.(226090307072)


MEMBER2 PARMAR ANJALI M.(226090307093)
MEMBER3 RATHOD HITIKSHA H.(226090307117)
MEMBER4 SHAH HIYA D.(226090307126)
MEMBER5 TALSANIYA RASHI N.(226090307134)

To
COMPUTERENGINEERINGDEPARTMENT
CUSHAHGOVT.POLYTECHNIC–SURENDRANAGAR

GUJARATTECHNOLOGICALUNIVERSITY–AHMEDABAD
DCE-CUSP 1
RESTAURANTMANAGEMENT

DECEMBER – 2023

DCE-CUSP 2
RESTAURANTMANAGEMENT

Introduction to Project
"Online Restaurant Website” is considered as an increasingly used application in restaurant
management. Just a few years ago, people used to spend long time waiting for a table to be
ready for them at a restaurant.
And after that, they would wait longer time to order their food. There was no surprise that the
food took too long to be prepared.
In short, the whole enjoyment of eating did eventually result in boredom and tiredness for
customers.
From another side, this is the restaurant management and staff who used to stand much
pressure to handle a lot of customers at the same time.
With great technology in general and the internet in specific, customers can be happy by using
online food ordering and reservation.

A restaurant management system is a type of software that has been specifically designed for
use within the restaurant industry.

Also known as restaurant management software, such solutions are intended to assist leaders
and others in carrying out the most critical managerial tasks.

A system of this type may be a comprehensive all-in-one solution, including elements of a


point-of-sale system, such as payment processing, with more complex back-end features,such
as workforce management, inventory management, and a booking or reservations system.

However, some restaurant management systems focus on specific areas.

 Benefits:-
Many of the benefits of using restaurant management systems are related to automation and
speeding up processes to improve the customer experience.
Modern customers expect fast, frictionless service, and restaurant management software plays
a key role in meeting these expectations.

DCE-CUSP 3
RESTAURANTMANAGEMENT

Working of Project
Our website “RESTAURANT MANAGEMENT” works in restaurant industry. It includes 4
main pages namely:-
1. HOME.
2. ABOUT US
3. ORDERNOW.
4. REVIEWS.

 Homepage contain basic pictures and information about our page.

 It contains pictures of food items which are displayed on the screen using
carousel effects.

 About Us contains basic information about the restaurant.

 Order now contains various item name with its price and other information.

 It also includes “SUMMARY” of order and its bill is display on screen.

 Website also contains Review page where customers can add their reviews.

DCE-CUSP 4
RESTAURANTMANAGEMENT

Code of Project

CODE FOR INDEX PAGE :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"
rel="stylesheet">
<link href="node_modules/bootstrap/scss/bootstrap">
<title>HOME PAGE</title>
</head>
<body>
<div class="container-fluid">
<h1 style="text-align: center; background-color: bisque; font-family:
cursive">CHEESY BITES</h1>
<title>Restaurant Website</title>
<body style="background-color: black;">
<nav class="navbar navbar-expand-lg">
<div class="container">
<ul class="navbar-nav" style="font-family: cursive;">
<li class="nav-item">
<a class="nav-link" href="home.html" style="color: bisque;">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html" style="color: bisque;">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="order.html" style="color: bisque;">Order
Now</a>
</li>
<li class="nav-item">
<a class="nav-link" href="review.html" style="color:bisque;">Reviews</a>
</li>
</ul>
</div>
</nav>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
DCE-CUSP 5
RESTAURANTMANAGEMENT

<script
src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js
"></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></scr
ipt>
</body>
</html>
<style>
.navbar-nav .nav-item
{ margin: 0 95px;
}
.navbar-nav .nav-link
{ color: black;
}
.carousel-item img {
align-items: center;
width: 350px;
height: 350px;
object-fit: contain; /* Maintain aspect ratio and cover container */
}
</style>
</head>
<body>

<div id="imageCarousel" class="carousel slide" data-ride="carousel">


<div class="carousel-inner">
<div class="carousel-item active">
<img src="image/pizza.jpg" class="d-block w-100" alt="Image 1">
<br>
<h1 class="text" style="text-align: center; color: beige; font-family:
cursive;">WELCOME TO CHEESY BITES!</h1>
</div>
<div class="carousel-item">
<img src="image/pasta.jpg" class="d-block w-100" alt="Image 2">
<br>
<h1 class="text" style="text-align: center; color: beige; font-family:
cursive;">WE SERVE GOOD FOOD HERE:)</h1>
</div>
<div class="carousel-item">
<img src="image/lasagne.jpg" class="d-block w-100" alt="Image 3">
<br>
<h1 class="text" style="text-align: center; color: beige; font-family:
cursive;">EXPLORE MENU FOR MORE;)</h1>
DCE-CUSP 6
RESTAURANTMANAGEMENT

</div>
<div class="carousel-item">
<img src="image/noodle.jpg" class="d-block w-100" alt="Image 4">
<br>
<h1 class="text" style="text-align: center; color: beige; font-family:
cursive;">SAY CHEESE!</h1>
</div>
</div>
<a class="carousel-control-prev" href="#imageCarousel" role="button" data-
slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#imageCarousel" role="button" data-
slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"><
/script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></scr
ipt>

<script>
// Activate the carousel with a 5-second interval
$(document).ready(function(){
$('#imageCarousel').carousel({
interval: 2000
});
});
</script>
</style>

DCE-CUSP 7
RESTAURANTMANAGEMENT

CODE FOR ORDER NOW :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min
.css">
<title>Document</title>
</head>
<body style="font-family:cursive;">
</head>
<h2 style="text-align: center; background-color: beige;">YOU CAN
ORDER FROM HERE!</h2>
<h2 style="text-align: center; background-color: beige;"><i>You can add
items and can check your total bill here!</i></h2>

<table id="items" class="table table-dark" style="background-


color:beige">
<th style="color: black;"><u>Items</th></u>
<th style="color: black;" ><u>Price</th></u>
</tr>
<tr style="color: black;">
<td>Margherita</td>
<td>12.99</td>
</tr>
<tr style="color: black;">
<td>Pepperoni</td>
<td>10.99</td>
</tr>
<tr style="color: black;">
<td>Spicy Arrabiata</td>
<td>14.99</td>
DCE-CUSP 8
RESTAURANTMANAGEMENT

</tr>
<td style="color: black;">Peppy Paneer</td>
<td style="color: black;">11.49</td>
</tr>
<td style="color: black;">Lasagne</td>
<td style="color: black;">12.99</td>
</tr>
<td style="color: black;">Baked Rigatoni</td>
<td style="color: black;">10.99</td>
</tr>
<td style="color: black;">Shrimp Fra Diavolo
<td style="color: black;">14.99</td>
</tr>
<td style="color: black;">Penne San Remo</td>
<td style="color: black;">11.99</td>
</tr>
<td style="color: black;">Spaghetti</td>
<td style="color: black;">11.99</td>
</tr>
<td style="color: black;">Linguene</td>
<td style="color: black;">11.99</td>
</tr>
<td style="color: black;">Fettuccine</td>
<td style="color: black;">11.99</td>
</tr>
<td style="color: black;">Cappeline</td>
<td style="color: black;">11.99</td>
</tr>
<td style="color: black;">Wings</td>
<td style="color: black;">12.99</td>
</tr>
<td style="color: black;">Fried Calamari</td>
<td style="color: black;">10.99</td>
</tr>
<td style="color: black;">Mozarella Caprese</td>
DCE-CUSP 9
RESTAURANTMANAGEMENT

<td style="color: black;">14.99</td>


</tr>
</table>
<h3>Order Summary</h3>

<table id="orderSummary">
</table>

<h3>Total: <span id="total">0</span></h3>

<script>
var itemsTable = document.getElementById("items");
var orderSummaryTable =
document.getElementById("orderSummary");
var totalElement = document.getElementById("total");
var total = 0;

// Add event listener to the items table


itemsTable.addEventListener("click", function(event) {
var target = event.target;

// Check if the clicked element is a table cell


if (target.tagName === "TD") {
var item = target.parentNode.cells[0].innerHTML;
var price = target.parentNode.cells[1].innerHTML;

// Prompt the user to enter the quantity


var quantity = parseInt(prompt("Enter quantity for " + item + ":"));

if (!isNaN(quantity) && quantity > 0) {


var row = orderSummaryTable.insertRow();
var itemName = row.insertCell(0);
var itemQuantity = row.insertCell(1);
var itemPrice = row.insertCell(2);

DCE-CUSP 10
RESTAURANTMANAGEMENT

itemName.innerHTML = item;
itemQuantity.innerHTML = quantity;
itemPrice.innerHTM

L = price * quantity;

total += price * quantity;


totalElement.innerHTML = total;
}
}
});
</script>
</body>
</html>

DCE-CUSP 11
RESTAURANTMANAGEMENT

CODE FOR REVIEWS CODE :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.c
ss" rel="stylesheet">
<title>Restaurant Reviews</title>
<style>
/* Add your custom styles here */
.reviews-container {
max-width: 800px;
margin: auto;
}
</style>
</head>
<body style="background-color: bisque; font-family: cursive;">

<div class="container mt-5 reviews-container">


<h2>Restaurant Reviews</h2>

<!-- Existing reviews -->


<div id="existing-reviews">
<!-- Reviews will be dynamically added here -->
</div>

<!-- Add new review form -->


<form id="review-form">
<div class="mb-3">
<label for="userName" class="form-label">Name</label>
<input type="text" class="form-control" id="userName" required>
DCE-CUSP 12
RESTAURANTMANAGEMENT

</div>
<div class="mb-3">
<label for="userReview" class="form-label">Review</label>
<textarea class="form-control" id="userReview" rows="3"
required></textarea>
</div>
<button type="button" class="btn btn-primary"
onclick="addReview()">Submit Review</button>
</form>
</div>

<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.
min.js"></script>
<script>
// JavaScript to handle review submission and display
function addReview() {
const userName = document.getElementById('userName').value;
const userReview = document.getElementById('userReview').value;

// Validation (You can add more validation if needed)

// Create review element


const reviewElement = document.createElement('div');
reviewElement.className = 'card mb-3';
reviewElement.innerHTML = `
<div class="card-body">
<h5 class="card-title">${userName}</h5>
<p class="card-text">${userReview}</p>
</div>
`;

// Append review to existing reviews


document.getElementById('existing-
reviews').appendChild(reviewElement);

DCE-CUSP 13
RESTAURANTMANAGEMENT

// Clear form fields


document.getElementById('userName').value = '';
document.getElementById('userReview').value = '';
}
</script>

</body>
</html>

DCE-CUSP 14
RESTAURANTMANAGEMENT

CODE FOR HOME PAGE :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Restaurant Menu</title>
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min
.css">
<style>
body {
background-color: #f8f9fa;
font-family: cursive;
}

.menu-container {
max-width:
600px; margin:
50px auto;
}

.menu-item
{ border: 1px
black; border-
radius: 5px;
margin-bottom: 10px;
padding: 10px;
background-color: burlywood;
}
</style>
</head>
<body style="background-color: antiquewhite;">
DCE-CUSP 15
RESTAURANTMANAGEMENT

<div class="container menu-container">

DCE-CUSP 16
RESTAURANTMANAGEMENT

<u><h2 class="text-left mb-4" style="color: brown;">EXPLORE OUR


DELIGHTS</h2></u>

<div class="menu-item">
<h4>PIZZA</h4>
<img src="image/pizza.jpg" style="width: 550px;">
<p>Classic thin crust pizza with red sauce.</p>
<p class="text-muted">$12.99</p>
</div>

<div class="menu-item">
<h4>PASTA</h4>
<img src="image/pasta.jpg" style="width: 550px;">
<p>Cheesy pasta in red tomato sauce.</p>
<p class="text-muted">$8.99</p>
</div>

<div class="menu-item">
<h4>LASAGNE</h4>
<img src="image/lasagne.jpg" style="width: 550px;">
<p>Vegetable lasagne with lots of cheese.</p>
<p class="text-muted">$16.99</p>
</div>

<div class="menu-item">
<h4>NOODLE</h4>
<img src="image/noodle.jpg" style="width: 550px;">
<p>Spicy vegetable noodles with tangy taste.</p>
<p class="text-muted">$16.99</p>
</div>
<div class="menu-item">
<h4>WINGS</h4>
<img src="image/wings.jpg" style="width: 550px;">
<p class="text-muted">$12.99</p>
</div>
DCE-CUSP 17
RESTAURANTMANAGEMENT

<div class="menu-item">
<h4>FRIED CALAMARI</h4>
<img src="image/frcalameri.jpg" style="width: 550px;">
<p class="text-muted">$10.99</p>
</div>
<div class="menu-item">
<h4>MOZARELLE CAPRESE</h4>
<img src="image/mozarellac.jpg" style="width: 550px;">
<p class="text-muted">$14.99</p>
</div>

</div>

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script
src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.
min.js"></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js
"></script>

</body>
</html>

DCE-CUSP 18
RESTAURANTMANAGEMENT

CODE FOR ABOUT US :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>About Us - Cheesy Bites</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-
serif; background-color: #f8f8f8;
color: #333;
margin: 0;
padding: 0;
}

header {
background-color: #ffae42;
padding: 1em;
text-align: center;
}

section {
max-width: 800px;
margin: 2em auto;
padding: 1em;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

h1 {
color: #ffae42;
DCE-CUSP 19
RESTAURANTMANAGEMENT

}
p{
line-height: 1.6;
}

footer {
text-align: center;
padding: 1em;
background-color: #333;
color: #fff;
}
</style>
</head>
<body>
<header>
<h1>Cheesy Bites</h1>
</header>

<section>
<h1>About Us</h1>
<p>Welcome to Cheesy Bites, where we transform ordinary moments
into extraordinary memories with our delectable range of cheesy delights.
Our passion for quality ingredients and exceptional taste is what sets us
apart.</p>
<p>At Cheesy Bites, every dish is crafted with love and a commitment
to perfection. From our signature pizzas to mouthwatering pasta dishes,
we bring you a culinary experience that indulges your senses.</p>
<p>Join us on a journey of flavor and discover the cheesy goodness
that defines our restaurant. We invite you to savor the moment, share the
joy, and make Cheesy Bites a part of your culinary adventures.</p>
</section>
<footer>
&copy; 2023 Cheesy Bites. All rights reserved.
</footer>
</body>
</html>
DCE-CUSP 20
RESTAURANTMANAGEMENT

Screenshots of Project

OUTPUT FOR INDEX PAGE :

OUTPUT FOR ORDER NOW :

DCE-CUSP 21
RESTAURANTMANAGEMENT

OTPUT FOR REVIEWS CODE :

OUTPUT FOR HOME PAGE :

DCE-CUSP 22
RESTAURANTMANAGEMENT

OUTPUT FOR ABOUT US :

DCE-CUSP 23

You might also like