Cart page

This page is optional, or it just can be a sidebar added to the Layout. The file name can be anything, though using the name cart.json is recommended.

Show cart items

Use useCart() hook to show cart items and counts on a cart page or a sidebar.

import {useCart} from "builderoo";
 
const {items} = useCart()

Update cart items

import {useCartItemQuantity} from "builderoo";
 
const {add, remove, set, count} = useCartItemQuantity(productId, variantId)
 
// Now add 1 item to the cart
add(1)
 
// remote the item from the cart
remove()
 
// set quantity of the product to a specific number
set(3)

Checkout

Checkout is as easy as having a link with href set to /checkout.

import {Link} from "builderoo";
 
function Cart(props) {
 return (
  <div>
    {/* other things */}
    <Link href="/checkout">Checkout Now</Link>
  </div>
 );
}

Collection Login/Signup etc