Home
Softono
cart-localstorage

cart-localstorage

Open source MIT JavaScript
95
Stars
18
Forks
2
Issues
5
Watchers
2 years
Last Commit

About cart-localstorage

JavaScript Shopping Cart library on top of localStorage

Platforms

Web Self-hosted

Languages

JavaScript

cart-localstorage

Super simple JavaScript shopping cart library

This micro library (2.2Kb) utilizes the browser's localStorage to create a persistent shopping cart instance.

Demo

Cart demo

Install:

Use npm or yarn to add it to your ES6 project:

npm install cart-localstorage
yarn add cart-localstorage
import { add, total } from 'cart-localstorage' 

add({id: 1, name: "Product 1", price: 100})
add({id: 2, name: "Product 2", price: 100}, 2)

console.log(total()) 
// output: 300

Bundled version (ES5) via CDN:

<script src="https://unpkg.com/[email protected]/dist/cart-localstorage.min.js" type="text/javascript"></script>
cartLS.add({id: 1, name: "Product 1", price: 100})
cartLS.add({id: 2, name: "Product 2", price: 100}, 2)

console.log(cartLS.total()) 
// output: 300

Documentation

add(product, [quantity:1])

Adds product to the cart. If the product already exists it increases the quantity with 1. The product object structure is flexible, only "id" and "price" are mandatory properties.

const myproduct = {id: 3, name: "Vans", price: 75}
add(myproduct, 2)

get(id)

Get product from the cart by id

get(1)
// {id: 1, name: "Nike Air", price: 100, quantity: 1}

exists(id)

Checks if the product already exists in the cart

exists(21)
// true or false

list()

Get the content of the cart as an array of products.

list()
// [{id: 1, name: "Nike Air", price: 100, quantity: 1}, {id: 2, name: "Adidas Superstar", price: 120, quantity: 2}]

remove(id)

Removes the product from the cart

remove(1)

update(id, property, value)

Updates the product's property with a certain value.

update(1,'price',200)

quantity(id, diff)

Increase / decrease product's quantity with a positive or negative value.

quantity(22,-1) // will decrease the quantity of product [id:22] with 1.

total([reducer])

By default returns with the total price:

total()
// 220

or you can pass a custom reducer function to summarize other attributes, like product quantity:

total((sum, product) => (sum += product.quantity), 0)

destroy()

Deletes the cart array from the browser's localStorage.

destroy()

License

This library is available under MIT license.