ASSIGNMENT NO: 14
Input-
Main:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Plant Shop</title>
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css"
rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container">
<a class="navbar-brand" href="#">Paudha</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto align-items-center">
<li class="nav-item">
<a class="nav-link active" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#products">Shop</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link" id="cartButton" data-bs-toggle="modal" data-bs-
target="#cartModal">
Cart (<span id="cartCount">0</span>)
</a>
</li>
<!-- Dropdown for About -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-
toggle="dropdown" aria-expanded="false">About</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">Plant care</a></li>
<li><a class="dropdown-item" href="#">Our team</a></li>
<li><a class="dropdown-item" href="#">Special Offers</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="#reviews">Reviews</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Jumbotron Section (Carousel) -->
<header id="carouselExample" class="carousel slide carousel-fade" data-bs-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img src="https://thumbs.dreamstime.com/b/garden-shop-under-open-air-close-up-row-plants-
landscape-design-offered-sale-295498398.jpg" class="d-block w-100" alt="First Slide">
<div class="carousel-caption d-none d-md-block">
<h1 class="display-4">Welcome to the Plant Shop</h1>
<p class="lead">Find your perfect plant companion today!</p>
<a href="#products" class="btn btn-primary btn-lg">Shop Now</a>
</div>
</div>
<div class="carousel-item">
<img src="https://fortheloveofgardeners.com/wp-content/uploads/2024/04/Easy-Indoor-Plants-Low-
Maintenance-Beauties-for-Any-Home-Featured.jpg" class="d-block w-100" alt="Second Slide">
<div class="carousel-caption d-none d-md-block">
<h1 class="display-4">Explore Our Variety</h1>
<p class="lead">We offer a wide range of plants for every home.</p>
<a href="#products" class="btn btn-primary btn-lg">Browse Plants</a>
</div>
</div>
<div class="carousel-item">
<img
src="https://cdn.shopify.com/s/files/1/0551/6489/files/PS_Gift_Guide_Image_2_1024x1024.png?v=16067416
37" class="d-block w-100" alt="Third Slide">
<div class="carousel-caption d-none d-md-block">
<h1 class="display-4">Bring Nature Home</h1>
<p class="lead">Add some greenery to your space with our beautiful plants.</p>
<a href="#products" class="btn btn-primary btn-lg">Shop Now</a>
</div>
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExample" data-bs-
slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExample" data-bs-
slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</header>
<!-- Cart Modal -->
<div class="modal fade" id="cartModal" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Shopping Cart</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<!-- Cart Items Section -->
<div id="cartSection">
<ul id="cartItems" class="list-group"></ul>
<p class="mt-3"><strong>Total: $<span id="cartTotal">0.00</span></strong></p>
</div>
<!-- Checkout Form Section (initially hidden) -->
<div id="checkoutSection" class="d-none">
<h4>Checkout</h4>
<form id="checkoutForm">
<div class="mb-3">
<label for="name" class="form-label">Full Name</label>
<input type="text" class="form-control" id="name" name="name" required>
</div>
<div class="mb-3">
<label for="email" class="form-label">Email</label>
<input type="email" class="form-control" id="email" name="email" required>
</div>
<div class="mb-3">
<label for="address" class="form-label">Shipping Address</label>
<textarea class="form-control" id="address" name="address" rows="3" required></textarea>
</div>
<div class="mb-3">
<label for="payment" class="form-label">Payment Method</label>
<select class="form-select" id="payment" name="payment" required>
<option value="">Select payment method</option>
<option value="credit">Credit Card</option>
<option value="debit">Debit Card</option>
<option value="paypal">PayPal</option>
</select>
</div>
<h5 class="mt-4">Order Summary</h5>
<ul id="orderSummary" class="list-group mb-3"></ul>
</form>
</div>
<!-- Order Confirmation Section (initially hidden) -->
<div id="confirmationSection" class="d-none">
<div class="alert alert-success">
<h4>Thank you for your order!</h4>
<p>Your order number is: <strong id="orderNumber"></strong></p>
<p>We've sent a confirmation email with your order details.</p>
</div>
</div>
</div>
<div class="modal-footer">
<!-- Cart Buttons -->
<div id="cartButtons">
<button class="btn btn-danger" id="clearCart">Clear Cart</button>
<button class="btn btn-success" id="checkoutButton">Checkout</button>
</div>
<!-- Checkout Buttons (initially hidden) -->
<div id="checkoutButtons" class="d-none">
<button class="btn btn-secondary" id="backToCart">Back to Cart</button>
<button class="btn btn-primary" id="placeOrder">Place Order</button>
</div>
<!-- Confirmation Buttons (initially hidden) -->
<div id="confirmationButtons" class="d-none">
<button class="btn btn-primary" id="continueShopping" data-bs-dismiss="modal">Continue
Shopping</button>
</div>
</div>
</div>
</div>
</div>
<!-- Product Section -->
<section id="products" class="py-5">
<div class="container">
<h2 class="text-center mb-5">Innovation meets nature!</h2>
<div class="row mb-4">
<!-- Larger Product 1 -->
<div class="col-lg-4 col-md-6 mb-4">
<div class="card h-100">
<img src="p.jpg" class="card-img-top" alt="Plant 1">
<div class="card-body">
<h5 class="card-title">Plant Matchmaking</h5>
<p class="card-text">Discover your perfect plant! Our smart recommendations match you with
plants based on your lifestyle, home environment, and care preferences.</p>
<a href="#" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
<!-- Larger Product 2 -->
<div class="col-lg-4 col-md-6 mb-4">
<div class="card h-100">
<img src="p2.jpg" class="card-img-top" alt="Plant 2">
<div class="card-body">
<h5 class="card-title">Greenery at Your Doorstep</h5>
<p class="card-text">We bring nature to you with fast, safe delivery and plants carefully
packaged for freshness, ensuring they arrive healthy and vibrant.</p>
<a href="#" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
<!-- Larger Product 3 -->
<div class="col-lg-4 col-md-6 mb-4">
<div class="card h-100">
<img src="p5.jpg" class="card-img-top" alt="Plant 3">
<div class="card-body">
<h5 class="card-title">Interactive Plant Care Hub</h5>
<p class="card-text">Access a personalized plant care guide with tips, reminders, and
troubleshooting advice, all tailored to your plants' needs, ensuring they flourish!</p>
<a href="#" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
</div>
<div class="row">
<!-- Smaller Product 1 -->
<div class="col-lg-3 col-md-4 col-sm-6 mb-4">
<div class="card">
<img src="f.jpg" class="card-img-top" alt="Plant 4">
<div class="card-body">
<h5 class="card-title">Ficcus plant</h5>
<p class="card-text">$12.00</p>
<a href="#" class="btn btn-primary btn-add-to-cart" data-product-name="Ficcus plant" data-
product-price="12.00">Add to Cart</a>
</div>
</div>
</div>
<!-- Smaller Product 2 -->
<div class="col-lg-3 col-md-4 col-sm-6 mb-4">
<div class="card">
<img src="ppp.jpeg" class="card-img-top" alt="Plant 5">
<div class="card-body">
<h5 class="card-title">Peace Lily</h5>
<p class="card-text">$18.00</p>
<a href="#" class="btn btn-primary btn-add-to-cart" data-product-name="Peace Lily" data-
product-price="18.00">Add to Cart</a>
</div>
</div>
</div>
<!-- Smaller Product 3 -->
<div class="col-lg-3 col-md-4 col-sm-6 mb-4">
<div class="card">
<img src="spider-plant.jpg" class="card-img-top" alt="Plant 6">
<div class="card-body">
<h5 class="card-title">Spider Plant</h5>
<p class="card-text">$14.00</p>
<a href="#" class="btn btn-primary btn-add-to-cart"
data-product-name="Spider plant" data-product-price="14.00">Add to Cart</a>
</div>
</div>
</div>
<!-- Smaller Product 4 -->
<div class="col-lg-3 col-md-4 col-sm-6 mb-4">
<div class="card">
<img src="ccc.jpg" class="card-img-top" alt="Plant 7">
<div class="card-body">
<h5 class="card-title">Cactus</h5>
<p class="card-text">$8.00</p>
<a href="#" class="btn btn-primary btn-add-to-cart"
data-product-name="Cactus" data-product-price="8.00">Add to Cart</a>
</div>
</div>
</div>
<!-- Smaller Product 5 -->
<div class="col-lg-3 col-md-6 col-sm-6 mb-4">
<div class="card">
<img src="ct.jpeg" class="card-img-top" alt="Plant 8">
<div class="card-body">
<h5 class="card-title">Bamboo Palm</h5>
<p class="card-text">$22.00</p>
<a href="#" class="btn btn-primary btn-add-to-cart"
data-product-name="Bamboo Palm" data-product-price="22.00">Add to Cart</a>
</div>
</div>
</div>
<!-- Smaller Product 6 -->
<div class="col-lg-3 col-md-4 col-sm-6 mb-4">
<div class="card">
<img src="https://wallpapers.com/images/file/snake-plant-pictures-3489-x-3489-
bzlb3yvavgnxs0y6.jpg" class="card-img-top" alt="Plant 7">
<div class="card-body">
<h5 class="card-title">Snake plant</h5>
<p class="card-text">$20.00</p>
<a href="#" class="btn btn-primary btn-add-to-cart"
data-product-name="Snake plant" data-product-price="20.00">Add to Cart</a>
</div>
</div>
</div>
<!-- Smaller Product 7 -->
<div class="col-lg-3 col-md-4 col-sm-6 mb-4">
<div class="card">
<img src="https://assets.bloomsflora.com/uploads/product-pics/13248_74_13248.webp"
class="card-img-top" alt="Plant 7">
<div class="card-body">
<h5 class="card-title">Golden money plant</h5>
<p class="card-text">$15.00</p>
<a href="#" class="btn btn-primary btn-add-to-cart"
data-product-name="Golden money plant" data-product-price="15.00">Add to Cart</a>
</div>
</div>
</div>
<!-- Smaller Product 8 -->
<div class="col-lg-3 col-md-4 col-sm-6 mb-4">
<div class="card">
<img src="ja.jpg" class="card-img-top" alt="Plant 7">
<div class="card-body">
<h5 class="card-title">Jade plant</h5>
<p class="card-text">$10.00</p>
<a href="#" class="btn btn-primary btn-add-to-cart"
data-product-name="Jade plant" data-product-price="10.00">Add to Cart</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- About Section -->
<section id="about" class="bg-light py-5">
<div class="container text-center">
<h2 class="mb-4">About Us</h2>
<p>At Paudha, we believe in bringing nature into your home with a variety of plants to fit every need.
Whether you're a seasoned gardener or a beginner, we have the perfect plant for you!</p>
</div>
</section>
<!-- Contact Section -->
<section id="contact" class="py-5">
<div class="container text-center">
<h2 class="mb-4">Contact Us</h2>
<p>If you have any questions or inquiries, feel free to reach out to us!</p>
<a href="mailto:info@plantshop.com" class="btn btn-primary">Email Us</a>
</div>
</section>
<!-- Footer -->
<footer class="bg-dark text-white text-center py-3">
<p>© 2025 Paudha | All Rights Reserved</p>
</footer>
<script>
let cart = JSON.parse(localStorage.getItem('cart')) || [];
function addToCart(name, price) {
cart.push({ name, price });
localStorage.setItem('cart', JSON.stringify(cart));
updateCartDisplay();
function updateCartDisplay() {
document.getElementById('cartCount').textContent = cart.length;
const cartItems = document.getElementById('cartItems');
cartItems.innerHTML = '';
let total = 0;
cart.forEach((item, index) => {
total += parseFloat(item.price);
const li = document.createElement('li');
li.className = 'list-group-item d-flex justify-content-between align-items-center';
li.innerHTML = `${item.name} - $${item.price} <button class='btn btn-danger btn-sm'
onclick='removeFromCart(${index})'>X</button>`;
cartItems.appendChild(li);
});
document.getElementById('cartTotal').textContent = total.toFixed(2);
function removeFromCart(index) {
cart.splice(index, 1);
localStorage.setItem('cart', JSON.stringify(cart));
updateCartDisplay();
function clearCart() {
cart = [];
localStorage.removeItem('cart');
updateCartDisplay();
function proceedToCheckout() {
// Check if cart has items
if (cart.length === 0) {
alert("Your cart is empty. Please add items before checkout.");
return;
// Hide cart section and show checkout section
document.getElementById('cartSection').classList.add('d-none');
document.getElementById('checkoutSection').classList.remove('d-none');
document.getElementById('cartButtons').classList.add('d-none');
document.getElementById('checkoutButtons').classList.remove('d-none');
// Display order summary in checkout
const orderSummary = document.getElementById('orderSummary');
orderSummary.innerHTML = '';
let total = 0;
cart.forEach(item => {
total += parseFloat(item.price);
const li = document.createElement('li');
li.className = 'list-group-item d-flex justify-content-between';
li.innerHTML = `<span>${item.name}</span><span>$${item.price}</span>`;
orderSummary.appendChild(li);
});
// Add total row
const totalLi = document.createElement('li');
totalLi.className = 'list-group-item d-flex justify-content-between font-weight-bold';
totalLi.innerHTML = `<span>Total</span><span>$${total.toFixed(2)}</span>`;
orderSummary.appendChild(totalLi);
function backToCart() {
// Show cart section and hide checkout section
document.getElementById('cartSection').classList.remove('d-none');
document.getElementById('checkoutSection').classList.add('d-none');
document.getElementById('cartButtons').classList.remove('d-none');
document.getElementById('checkoutButtons').classList.add('d-none');
function placeOrder() {
// Basic validation
const name = document.getElementById('name').value;
const email = document.getElementById('email').value;
const address = document.getElementById('address').value;
const payment = document.getElementById('payment').value;
if (!name || !email || !address || !payment) {
alert("Please fill in all required fields.");
return;
// Process the order (in a real application, you would send this to a server)
const orderData = {
customer: {
name: name,
email: email,
address: address,
payment: payment
},
items: cart,
total: cart.reduce((sum, item) => sum + parseFloat(item.price), 0)
};
// For demo purposes - normally you'd send this to your backend
console.log("Order submitted:", orderData);
// Show order confirmation
document.getElementById('checkoutSection').classList.add('d-none');
document.getElementById('confirmationSection').classList.remove('d-none');
document.getElementById('checkoutButtons').classList.add('d-none');
document.getElementById('confirmationButtons').classList.remove('d-none');
document.getElementById('orderNumber').textContent = generateOrderNumber();
// Clear cart after successful order
clearCart();
function generateOrderNumber() {
// Generate a random order number for demo purposes
return 'PLT-' + Math.floor(Math.random() * 1000000).toString().padStart(6, '0');
function continueShopping() {
// Reset the view
document.getElementById('cartSection').classList.remove('d-none');
document.getElementById('checkoutSection').classList.add('d-none');
document.getElementById('confirmationSection').classList.add('d-none');
document.getElementById('cartButtons').classList.remove('d-none');
document.getElementById('checkoutButtons').classList.add('d-none');
document.getElementById('confirmationButtons').classList.add('d-none');
// Add event listeners
document.querySelectorAll('.btn-add-to-cart').forEach(button => {
button.addEventListener('click', (event) => {
const name = event.target.dataset.productName;
const price = parseFloat(event.target.dataset.productPrice);
addToCart(name, price);
});
});
document.getElementById('clearCart').addEventListener('click', clearCart);
document.getElementById('checkoutButton').addEventListener('click', proceedToCheckout);
document.getElementById('backToCart').addEventListener('click', backToCart);
document.getElementById('placeOrder').addEventListener('click', placeOrder);
document.getElementById('continueShopping').addEventListener('click', continueShopping);
window.onload = updateCartDisplay;
</script>
<!-- Bootstrap JS Bundle (includes Popper.js) -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-
alpha1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
CSS:
/* General body styles */
body {
font-family: 'Arial', sans-serif;
line-height: 1.6;
/* Navbar customizations */
.navbar {
background-color: #012014;
.navbar .navbar-brand,
.navbar .nav-link {
color: #ecf0f1;
.navbar .nav-link:hover {
color: #5eeda8;
.dropdown-menu {
list-style: none;
position: absolute;
top: 100%;
left: 0;
background-color: #7d8575;
border-radius: 5px;
display: none;
z-index: 5;
.dropdown-menu li {
margin: 0;
.dropdown-menu a {
display:block;
padding: 10px 15px;
color: white;
/* Carousel (Jumbotron) styles */
#carouselExample .carousel-item {
height: 70vh; /* Adjust carousel height */
#carouselExample img {
object-fit: cover; /* Ensure images cover the entire carousel area */
height: 100%;
.carousel-caption {
bottom: 20%;
.carousel-caption h1 {
font-size: 3rem;
font-weight: bold;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
.carousel-caption p {
font-size: 1.25rem;
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
/* Featured Products Section */
#products .card {
border: none;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease;
#products .card:hover {
transform: scale(1.05);
/* About Section */
#about {
background-color: #f4f4f4;
color: #333;
#about p {
font-size: 1.1rem;
line-height: 1.8;
/* Contact Section */
#contact {
background-color: #2c3e50;
color: #ecf0f1;
#contact .btn-primary {
background-color: #3a769d;
border: none;
#contact .btn-primary:hover {
background-color: #a9dcff;
/* Footer */
footer {
background-color: #2c3e50;
footer p {
margin: 0;
font-size: 1rem;
/* Custom Button */
.btn-primary {
background-color: #27ae60;
border: none;
.btn-primary:hover {
background-color: #8adaac;
}
/* Card Styles */
.card {
border-radius: 10px;
overflow: hidden;
.card-img-top {
border-radius: 10px 10px 0 0;
/* Responsive Media Queries */
@media (max-width: 768px) {
.carousel-caption h1 {
font-size: 2.5rem;
.carousel-caption p {
font-size: 1rem;
Json file:
const express = require('express');
const mongoose = require('mongoose');
const path = require('path');
const bodyParser = require('body-parser');
const cors = require('cors');
// Initialize express app
const app = express();
const PORT = process.env.PORT || 3000;
// Middleware
app.use(cors());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static(path.join(__dirname, 'public')));
// MongoDB Connection
mongoose.connect('mongodb://localhost:27017/plantShop', {
useNewUrlParser: true,
useUnifiedTopology: true
})
.then(() => console.log('Connected to MongoDB'))
.catch(err => console.error('Could not connect to MongoDB', err));
// Define Schemas
const userSchema = new mongoose.Schema({
name: { type: String, required: true },
email: { type: String, required: true, unique: true },
address: String,
createdAt: { type: Date, default: Date.now }
});
const productSchema = new mongoose.Schema({
name: { type: String, required: true },
price: { type: Number, required: true },
description: String,
imageUrl: String,
inStock: { type: Boolean, default: true }
});
const orderSchema = new mongoose.Schema({
user: {
name: { type: String, required: true },
email: { type: String, required: true },
address: { type: String, required: true }
},
items: [{
productId: { type: mongoose.Schema.Types.ObjectId, ref: 'Product' },
name: String,
price: Number,
quantity: { type: Number, default: 1 }
}],
totalAmount: Number,
paymentMethod: String,
orderNumber: { type: String, unique: true },
status: { type: String, default: 'Pending' },
createdAt: { type: Date, default: Date.now }
});
// Create models
const User = mongoose.model('User', userSchema);
const Product = mongoose.model('Product', productSchema);
const Order = mongoose.model('Order', orderSchema);
// API Routes
// Get all products
app.get('/api/products', async (req, res) => {
try {
const products = await Product.find();
res.json(products);
} catch (error) {
res.status(500).json({ message: error.message });
});
// Get a single product
app.get('/api/products/:id', async (req, res) => {
try {
const product = await Product.findById(req.params.id);
if (!product) return res.status(404).json({ message: 'Product not found' });
res.json(product);
} catch (error) {
res.status(500).json({ message: error.message });
});
// Create a new order
app.post('/api/orders', async (req, res) => {
try {
// Generate order number
const orderNumber = 'PLT-' + Math.floor(Math.random() * 1000000).toString().padStart(6, '0');
const newOrder = new Order({
user: {
name: req.body.customer.name,
email: req.body.customer.email,
address: req.body.customer.address
},
items: req.body.items.map(item => ({
name: item.name,
price: item.price,
quantity: item.quantity || 1
})),
totalAmount: req.body.total,
paymentMethod: req.body.customer.payment,
orderNumber: orderNumber
});
const savedOrder = await newOrder.save();
res.status(201).json({
message: 'Order created successfully',
orderNumber: savedOrder.orderNumber,
orderId: savedOrder._id
});
} catch (error) {
res.status(400).json({ message: error.message });
});
// Get user's orders
app.get('/api/orders/user/:email', async (req, res) => {
try {
const orders = await Order.find({ 'user.email': req.params.email });
res.json(orders);
} catch (error) {
res.status(500).json({ message: error.message });
});
// Create a new user (for registration)
app.post('/api/users', async (req, res) => {
try {
// Check if user already exists
const existingUser = await User.findOne({ email: req.body.email });
if (existingUser) {
return res.status(400).json({ message: 'User already exists' });
const newUser = new User({
name: req.body.name,
email: req.body.email,
address: req.body.address
});
const savedUser = await newUser.save();
res.status(201).json(savedUser);
} catch (error) {
res.status(400).json({ message: error.message });
});
// Sample route to add initial products
app.post('/api/seed-products', async (req, res) => {
try {
// Sample products from your HTML
const sampleProducts = [
{ name: 'Ficcus plant', price: 12.00, description: 'Beautiful indoor plant', imageUrl: 'f.jpg' },
{ name: 'Peace Lily', price: 18.00, description: 'Elegant flowering plant', imageUrl: 'ppp.jpeg' },
{ name: 'Spider Plant', price: 14.00, description: 'Air-purifying plant', imageUrl: 'spider-plant.jpg' },
{ name: 'Cactus', price: 8.00, description: 'Low-maintenance desert plant', imageUrl: 'ccc.jpg' },
{ name: 'Bamboo Palm', price: 22.00, description: 'Tropical indoor palm', imageUrl: 'ct.jpeg' },
{ name: 'Snake plant', price: 20.00, description: 'Low-light tolerant succulent', imageUrl:
'https://wallpapers.com/images/file/snake-plant-pictures-3489-x-3489-bzlb3yvavgnxs0y6.jpg' },
{ name: 'Golden money plant', price: 15.00, description: 'Feng shui prosperity plant', imageUrl:
'https://assets.bloomsflora.com/uploads/product-pics/13248_74_13248.webp' },
{ name: 'Jade plant', price: 10.00, description: 'Succulent with round leaves', imageUrl: 'ja.jpg' }
];
// Clear existing products
await Product.deleteMany({});
// Insert sample products
const products = await Product.insertMany(sampleProducts);
res.status(201).json({
message: 'Sample products added successfully',
products
});
} catch (error) {
res.status(400).json({ message: error.message });
});
// Modify the front-end HTML file
app.get('/', (req, res) => {
res.sendFile(path.join(__dirname, 'public', 'index.html'));
});
// Start the server
app.listen(PORT, () => {
console.log(`Server is running on port ${PORT}`);
});
