You are on page 1of 21

AISSCE 2024

Web Application
Project File

Name – Sagnik Biswas


Class – XII
Section - A
Roll Number –
School – Apeejay School, Salt Lake
Certificate
This is to certify that Sagnik Biswas of class XII A of Apeejay School,
Saltlake has completed the project on the topic of “Create a shopping site
based on Tamil Nadu” during the academic year 2023-24 towards the partial
fulfillment of credit for the Web Application practical evaluation of AISSCE
2023-24 under the supervision of Mrs. Sayanti Roy.

Signature of Signature of
Internal Examiner External Examiner
Acknowledgement
I am extremely thankful to our Web Application
teacher Mrs. Sayanti Roy for her continuous
guidance, encouragement and support
throughout the duration of the project.
Without her motivation and help, the
successful completion of this project would not
have been possible. I would also like to extend
my gratitude to our Principal, Mrs. Anindita
Banerjee of Apeejay School Saltlake for
providing constant support and the golden
opportunity to do this informative project
which helped me learn alot of new things about
programming in Python and using SQL in
general.
TOPIC PAGE NO.
Certificate 2
Declaration 3
Aim of the Project 4
Case Study 1 5 - 24
Case Study 2 25 - 39
Bibliography 40
Acknowledgment 41
HOME PAGE :
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Shopping Site</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f0f8f0;;
}

header {
background-color:#388e3c;
color: white;
text-align: left;
padding: 1em;
display: flex;
align-items: center;
justify-content: space-between;
}

.logo img {
width: 100px;
margin-right: 10px;
}

.title {
margin: 0;
}

.cart-logo {
margin-right: 20px;
cursor: pointer;
}

section {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
padding: 2em;
min-height: 100vh; /* Ensure the section takes at least the full viewport height */
}

.product {
border: 1px solid #ddd;
border-radius: 8px;
padding: 1em;
margin: 1em;
width: 200px;
background-color: white;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.product img {
width: 100%;
height: auto;
}

.add-to-cart-button {
background-color: #4caf50;
color: white;
border: none;
padding: 5px 10px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 12px;
margin-top: 10px;
cursor: pointer;
border-radius: 4px;
}

.advertisement {
text-align: center;
padding: 1em;
background-color: #ddd;
margin: 1em;
width: 30%; /* Adjusted width for the offers */
}

footer {
background-color: #333;
color: white;
text-align: center;
padding: 0.5em;
position: fixed;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>

<header>
<div class="logo">
<img src="C:\Users\Raju\Desktop\C.jpg" alt="Logo">
</div>
<h1 class="title">Welcome to My Shopping Site</h1>
<a href="cart-page.html" class="cart-logo">
<img src="C:\Users\Raju\Desktop\cart.jpg" alt="Cart Logo" width="30">
</a>
</header>

<section>
<div class="product">
<img src="C:\Users\Raju\Desktop\Tanjore.jpg" alt="Product 1">
<h2>Product 1</h2>
<p>Description of Product 1.</p>
<p>Rs.5999.00</p>
<button class="add-to-cart-button">Add to Cart</button>
</div>

<div class="product">
<img src="C:\Users\Raju\Desktop\Textile.jpg" alt="Product 2">
<h2>Product 2</h2>
<p>Description of Product 2.</p>
<p>$4999.00</p>
<button class="add-to-cart-button">Add to Cart</button>
</div>

<div class="product">
<img src="C:\Users\Raju\Desktop\Pots.jpg" alt="Product 3">
<h2>Product 3</h2>
<p>Description of Product 3.</p>
<p>$559.00</p>
<button class="add-to-cart-button">Add to Cart</button>
</div>

<!-- Add more products as needed -->

<div class="advertisement">
<p>Special Offer: Buy one, get one free!</p>
<p>Flash Sale: 50% off on selected items!</p>
<iframe src="https://www.youtube.com/embed/your-video-id" allowfullscreen></iframe>
</div>
</section>

<footer>
<p>&copy; 2023 My Shopping Site</p>
</footer>

</body>
</html>
Shopping Cart:

< html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Shopping Cart</title>
<style>
body {
font-family: 'Arial', sans-serif;
margin: 0;
padding: 0;
background-color: #f0f8f0; /* Light Green */
color: #333;
}

header {
background-color: #388e3c; /* Green */
color: #fff;
text-align: center;
padding: 1em;
}

main {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
padding: 20px;
}

.cart-item {
border: 1px solid #a5d6a7; /* Light Green */
border-radius: 8px;
overflow: hidden;
margin: 10px;
width: 200px;
text-align: center;
padding: 10px;
background-color: #e0f2e9; /* Pale Green */
}

.cart-item img {
width: 100%;
height: auto;
margin-bottom: 10px;
}

footer {
background-color: #388e3c; /* Green */
color: #fff;
text-align: center;
padding: 1em;
position: fixed;
bottom: 0;
width: 100%;
}
</style>
</head>

<body>
<header>
<h1>Shopping Cart</h1>
</header>

<main>
<div class="cart-item">
<img src="C:\Users\Raju\Desktop\Tanjore.jpg" alt="Item 1">
<p>Rs.5999.00</p>
</div>

<div class="cart-item">
<img src="C:\Users\Raju\Desktop\Textile.jpg" alt="Item 2">
<p>Rs4999.00</p>
</div>.
</body>
</html>

Output:
Terms and Conditions Page:
< html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Terms and Conditions</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
padding: 20px;
line-height: 1.6;
background: linear-gradient(to right, #a1ff84, #1c9951);
color: #fff;
}

h1 {
text-align: center;
}

h2 {
margin-top: 20px;
}

p{
margin-bottom: 15px;
}
</style>
</head>
<body>

<h1><u> Terms and Conditions</u></h1>

<div>
<h2>1. Introduction</h2>
<p>Welcome to our shopping site. These terms and conditions govern your use of this website; by using
our website, you accept these terms and conditions in full.</p>

<h2>2. Site Content</h2>


<p>All content on this site is provided for general information purposes only. We do not warrant the
accuracy, completeness, or usefulness of this information.</p>

<h2>3. User Account</h2>


<p>To access certain features of the site, you may be required to register an account. You agree to
provide accurate and complete information during the registration process.</p>
<p>You are responsible for maintaining the confidentiality of your account information, and you agree to
accept responsibility for all activities that occur under your account.</p>

<h2>4. Privacy Policy</h2>


<p>Your use of this site is also governed by our Privacy Policy. Please review our Privacy Policy to
understand our practices.</p>
<p>We may collect, use, and disclose personal information according to our Privacy Policy. By using our
site, you consent to these practices.</p>

<h2>5. Product Information</h2>


<p>We strive to provide accurate and up-to-date product information, including descriptions, images,
and specifications. However, we do not guarantee the accuracy, completeness, or reliability of any product
details.</p>
<p>Product images are for illustrative purposes only, and actual products may vary. We reserve the right
to make changes to product information at any time without prior notice.</p>

<h2>6. Orders and Payments</h2>


<p>Placing an order on our site indicates your intention to purchase the selected items. All orders are
subject to availability and acceptance by us.</p>
<p>Payment must be made in full before the order is processed and shipped. We accept various payment
methods; please review our payment options during the checkout process.</p>
<p>We reserve the right to refuse or cancel any order for any reason at any time.</p>

<h2>7. Shipping and Delivery</h2>


<p>Shipping times and costs are provided during the checkout process. We make every effort to ship
orders promptly, but we are not responsible for delays caused by factors beyond our control, such as
customs, weather, or carrier issues.</p>
<p>You are responsible for providing accurate shipping information. We are not responsible for lost or
undeliverable packages due to inaccurate shipping information provided by you.</p>

<h2>8. Returns and Refunds</h2>


<p>We want you to be satisfied with your purchase. Our Returns and Refunds Policy outlines the
conditions under which you can return items and receive a refund.</p>
<p>Before returning items, please review our Returns and Refunds Policy for detailed instructions and
eligibility criteria.</p>
<p>Refunds will be processed in the original form of payment, and it may take several business days for
the refund to appear in your account.</p>

<h2>9. Intellectual Property</h2>


<p>All intellectual property rights related to the website and its content, including images, logos, and
text, belong to us. Unauthorized use of any content or materials is strictly prohibited.</p>
<p>You may not reproduce, distribute, display, or create derivative works of any content on this site
without our express written permission.</p>

<h2>10. Governing Law</h2>


<p>These terms and conditions are governed by and construed in accordance with the laws of [Your
Country]. Any disputes relating to these terms and conditions will be subject to the exclusive jurisdiction of
the courts in [Your Jurisdiction].</p>

<h2>11. Changes to Terms</h2>


<p>We reserve the right to modify these terms and conditions at any time. Changes will be effective
immediately upon posting on the website. Your continued use of the site after changes are posted constitutes
your acceptance of the updated terms and conditions.</p>
<h2>12. Contact Information</h2>
<p>If you have any questions or concerns about these terms and conditions, please contact us at
[contact@example.com].</p>
</div>

</body>
</html>
Output :
Contact Us Page :
< html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Contact Us - Shopping Site</title>

<style>

body {

font-family: Arial, sans-serif;

margin: 20px;

padding: 20px;

line-height: 1.6;

background-color: #1c9951; /* Dark green background /

color: #fff; / Text color /

h1, h2, h3 {

text-align: center;

}
h2 {

margin-top: 20px;

p{

margin-bottom: 15px;

form {

max-width: 600px;

margin: 20px auto;

padding: 20px;

background-color: #4caf50; / Medium green background /

border-radius: 8px;

label {

display: block;

margin-bottom: 8px;

font-weight: bold;

color: #fff; / Text color /


}

input,

textarea {

width: 100%;

padding: 8px;

margin-bottom: 15px;

border: 1px solid #fff; / White border /

border-radius: 4px;

box-sizing: border-box;

background-color: #fff; / White background /

color: #333; / Text color /

button {

background-color: #fff; / White background /

color: #4caf50; / Medium green text color /

padding: 10px 15px;

border: none;

border-radius: 4px;

cursor: pointer;

}
.faq-section {

margin-top: 40px;

background-color: #a1ff84; / Light green background */

padding: 20px;

border-radius: 8px;

</style>

</head>

<body>

<h1>Contact Us - Shopping Site</h1>

<h2>Customer Support Information</h2>

<p>If you need assistance or have any questions, our customer support team is here to help.</p>

<p>Email: Email@example.com</p>

<p>Phone: +91 7892637XXX</p>

<form>

<h2>Contact Form</h2>

<label for="name">Your Name:</label>

<input type="text" id="name" name="name" required>

<label for="email">Your Email:</label>


<input type="email" id="email" name="email" required>

<label for="message">Your Message:</label>

<textarea id="message" name="message" rows="4" required></textarea>

<button type="submit">Submit</button>

</form>

<div class="faq-section">

<h2>Frequently Asked Questions (FAQs)</h2>

<p>Check out our FAQs below to find answers to common questions.</p>

<!-- Add your FAQs here -->

<h3>Q: How can I track my order?</h3>

<p>A: You can track your order by logging into your account and navigating to the order history section.</p>

<h3>Q: What is your return policy?</h3>

<p>A: Our return policy allows you to return items within 30 days of purchase. Please refer to our Returns and Refunds
page for detailed information.</p>

</div>

</body>

</html>
Output:
Bibliography

THE INFORMATION AND IMAGES USED IN THE PROJECT ARE THAKEN


FROM THE FOLLOWING SOURCES:

 www.wikipedia.org
 www.eyeonasia.gov.sg
 Web application book NCERT for classes 11 and 12
DECLARATION
I, SAGNIK BISWAS, the undersigned a student of APEEJAY SCHOOL, SALT
LAKE, KOLKATA do hereby declare that this investigatory project is my own
work and has been carried out under the supervision of our Web Application
Teacher Mrs. Sayanti Roy. This project has not been submitted to any other
institution/university for the reward of degree, diploma anywhere before.

You might also like