QualityCart

QualityCart is a web application inspired by Costco. It is designed to simulate an e-commerce website, providing features such as product display, cart functionality, backend integration for user data and orders,products display and removing from the cart . This project serves as a platform for learning and practicing HTML, CSS, and JavaScript.

---

Features

• Cart Management: Add and remove products from the cart.
• Real-Time Price Calculations: Automatic price updates in the cart based on product quantity and selection.
• Backend Integration:
  • Manage user data (e.g., login).
  • Products display and removing from the cart
• Auto-Slider with Animation: Images automatically slide using setInterval.
• Sorting and Filtering: Easily sort and filter products based on user actions.
• Navigation: Clickable links that navigate to specific pages (e.g., customer service, membership,shop Now).
• User Interface Pages:
  • Sign-in and Login page
  • Order Return page
  • Customer Service page
  • Membership page
  • Footer with additional links and resources
  • Shop Now
  • Payment Page -Thank You Message page

---

Purpose and Motivation

This project was created as a hands-on way to strengthen skills in HTML, CSS, and JavaScript, while integrating backend technologies.

---

Setup and Usage

To run the project:

1. Open the index.html file in a browser for the frontend.
2. Link the backend server by connecting to the provided backend URL.
3. Ensure backend services are running to handle user data and orders seamlessly.

---

Screenshots

Homepage and Features

Homepage Features Homepage Features Homepage Features Homepage Features Homepage Features

---

Unique Aspects

• Image Slider: A dynamic feature where images move automatically using animations.
• Backend Integration: Robust handling of user data, order management, and cart functionality with real-time updates.
• Navigation Experience: Smooth user experience with direct links to multiple interactive pages.

---

Links

Backend Link: QualityCart API

Future Improvements

• Further enhancement of responsiveness for mobile devices.
• Addition of advanced filtering and search functionality for product discovery.

---

Acknowledgments

This project was inspired by Costco and serves as a learning tool for web development.