UGBECOMMERCIALS

ugbecommercials is an ecommerce store built with react and styled with tailwind css.

Features

React Router was used to enable navigation among views of various components and each route has their specific features and animations.
Scroll restoration was used to keep the flow of navigation when going back and forth between different pages.
Context API was used to create (cart and setCart) states that was accessed throughout the component hierarchy without passing the props down manually to each level.
This was done to prevent props drilling.(or moving props from grandparent to parent to child, and so on).
Icons used throughout the project was gotten from the react icons library.

Hover over a product image to see the add-to-cart button and an eye icon(click on the eye icon to go to the product description page).
Items can be added to the cart in various ways including the home page and shop page(accesible from the nav menu) and the project description page.
Click on the cart icon on the nav menu to go to the cart page where all products added are arranged and the total sum is calculated and displayed.
Quantity of each item in the cart can be modified and deleted completely from the cart(by clicking the trash icon on the item tray) and the total sum is further modified.