Skip to content

Latest commit

 

History

History
49 lines (31 loc) · 1.77 KB

README.md

File metadata and controls

49 lines (31 loc) · 1.77 KB
Raw

addToCart

The addToCart project is a simple shopping cart implementation showcasing the addition of products into a cart and adjusting their quantities. This project is specifically tailored for "Lincolnshire Saddles Ltd.", a fictional saddle company.

Preview

Lincolnshire Saddles Ltd.

Features

  1. Add products to the shopping bag.
  2. View items in the shopping bag.
  3. Adjust the quantity of products in the shopping bag.
  4. See the total price of items in the bag.

Setup

  1. Clone the repository: 
    git clone https://github.com/chensov/addToCart.git
cd addToCart
  2. Open in browser:
    • Simply open the index.html file in your preferred web browser.

How it Works

  1. Display Products: The products are fetched from a static array and displayed on the main page. Each product has a button to add it to the cart.

  2. View Shopping Bag: Click on the shopping bag icon to view the items added to the cart. This will slide in a card showing the products, their quantities, and their prices.

  3. Adjust Quantity: In the shopping bag, you can increase or decrease the quantity of a product. The total price and quantity of products in the cart are updated in real-time.

  4. Close Shopping Bag: Click the Close button to hide the shopping bag.

Structure

The project primarily consists of:

  • index.html - The main HTML structure.
  • style.css - Contains the styling for the project.
  • app.js - Contains the JavaScript logic for handling the cart functionality.

Future Enhancements

  1. Integrating a backend to persist bag data.
  2. Implementing user accounts and saving shopping bag states for users.
  3. Introducing more interactive UI/UX elements.