Motivation

For quite some time, I have been interested in creating an e-commerce website, as so many individuals desire a platform through which they can sell their products. My initial foray into developing such a website came in the form of a frontend mentor project, which, although simple, sparked my interest in fully immersing myself in the creation of a fully functioning e-commerce application

Description

Tech Stack:

Introducing an ecommerce app where you can not only buy delicious spices, but also enjoy a touch of humor while you're at it! In this app, you can easily add items to your cart, remove them, and make purchases just as you would on any other ecommerce platform. The product information is stored in a headless content management system called Sanity.io, and it also utilizes Firebase for user sign-in and sign-out. Whether you're signed in or not, your items will be saved for your convenience.

Biggest Hurdle

I wanted to ensure that the products a user adds to their cart are persistently saved in local storage. However, in server-side rendered apps, this task is not as straightforward. I had to first add the users cart to local storage then whenever the component renders we check if the window object is present and, if so, then check if there is anything in local storage under the key cartItems. If not, I set the user's cart to be an empty array.

FuturePlans

In the future, I hope to enhance the user experience by adding the ability for users to change their displayed image, as well as a section to view their purchase history and i plan on adding similar products inside the cart under the users items. This will provide a more personalized and convenient user experience.