ShopLUXE is a modern, responsive front-end e-commerce website built using HTML5, CSS3, Bootstrap 5, and JavaScript. The project provides a realistic online shopping experience with category-wise product browsing, product details, wishlist, shopping cart, checkout, and order confirmation pages.
The website focuses on clean UI design, responsive layouts, reusable JavaScript components, and Local Storage-based functionality.
-
🏠 Modern Landing Page
-
📂 Category-wise Product Listing
-
👕 Multiple Categories
- Men
- Women
- Kids
- Electronics
- Beauty & Personal Care
- Accessories
- Home Decor
- Books
-
🔍 Product Details Page
-
🖼️ Multiple Product Images
-
⭐ Product Ratings
-
📏 Size Selection
-
❤️ Wishlist (Local Storage)
-
🛒 Shopping Cart (Local Storage)
-
➕ Quantity Management
-
💳 Checkout Page
-
✅ Order Confirmation Page
-
📱 Fully Responsive Design
-
🎨 Modern UI with Bootstrap 5
-
⚡ Dynamic JavaScript Rendering
- HTML5
- CSS3
- Bootstrap 5
- JavaScript (ES6)
- Local Storage API
- Font Awesome
ShopLUXE/
│
├── index.html
├── category.html
├── mens.html
├── womens.html
├── kids.html
├── electronics.html
├── beauty.html
├── accessories.html
├── home_decor.html
├── book.html
├── product.html
├── cart.html
├── wishlist.html
├── checkout.html
├── order_confirmation.html
│
├── assets/
│ ├── css/
│ │ style.css
│ │
│ ├── js/
│ │ script.js
│ │
│ └── images/
│ (all project images)
│
└── README.md
- Dynamic product database using JavaScript
- Category-wise filtering
- Product detail navigation
- Suggested products
- Add to Cart
- Remove from Cart
- Quantity Update
- Total Price Calculation
- Persistent cart using Local Storage
- Add to Wishlist
- Remove from Wishlist
- Persistent wishlist using Local Storage
- Billing Details Form
- Order Summary
- Payment Method Selection
- Order Confirmation Page
- Responsive Navigation Bar
- Animated Hero Section
- Interactive Category Cards
- Product Cards with Hover Effects
- Responsive Product Gallery
- Clean Checkout Interface
- Sticky Cart Summary
- Professional Footer
- Mobile Friendly Design
This project helped strengthen my understanding of:
- Responsive Web Design
- DOM Manipulation
- JavaScript Event Handling
- Local Storage
- Dynamic Rendering
- Modular UI Design
- Bootstrap Components
- Front-End Project Structure
This project was developed by taking inspiration from my previous E-Commerce project created during my Internship Studio internship. I have significantly modified, redesigned, and enhanced the original work by improving the UI/UX, restructuring the project architecture, adding new product categories, implementing dynamic JavaScript functionality, improving responsiveness, and introducing additional features such as wishlist, checkout, order confirmation, and Local Storage integration.
- Home Page
- Categories
- Product Details
- Wishlist
- Shopping Cart
- Checkout
- Order Confirmation
- User Authentication
- Search Functionality
- Product Filtering
- Product Sorting
- Coupon System
- Payment Gateway Integration
- Backend Integration
- Order History
- User Dashboard
- Admin Panel
- Database Connectivity
Krishti Das
B.Tech – Computer Science & Engineering
Passionate about Full Stack Development, Front-End Development, JavaScript, SAP ABAP, and Data Science.
This project was built for learning, portfolio development, and to strengthen practical front-end development skills by implementing a complete responsive e-commerce website using modern web technologies.