Cooking while shopping
This example demonstrates a simple e-commerce workflow with a product list and a shopping cart. Cart data is stored in a browser cookie instead of a database, each entry contains only the product ID and quantity needed to reconstruct the cart.
(cookie structure) 👉
{
'pl-1': 4,
'pl-2': 1,
'pl-3': 2,
...
}
The application provides controls for adding products to the cart, updating item quantities, and removing products, while keeping the cart state persistent across page reloads and future visits.
What I've learned?
- Next.js Cookies 🍪
- cookie-next
- Improving TailwindCSS
- Array.reduce() (used for sum total in cart)
Watch your wallet!
Vexon CoreStep '08 LX
Everyday comfort meets bold tri-color style in this performance-driven design.
$399.00$499.00
Urban Chill Jacket
A denim puffer with tonal blues, perfect for layering across seasons.
$180.00
Maison Liora Bag
A refined bag that easily switches from shoulder to crossbody or top-handle.
$420.00