Audiophile

A multi-page e-commerce website for an online retailer selling audio gear

desktop size preview
laptop size preview
tablet size preview
mobile size preview

Features

  • 11-page website (1 home page, 1 checkout page, 3 category pages, 6 product pages)
  • Responsive layout to fit all device sizes
  • Hover states for all interactive elements
  • Connects to a headless content management system (Sanity) which stores product details and submitted customer orders
  • CMS can be accessed at [domain]/admin to update product details and review customer orders
  • Functional shopping cart which uses React's context hook and local storage to keep track of products added to the cart by user, even after a page refresh
  • Calculates sales tax and shipping fees for each order
  • Checkout form validation (server-side and client-side)
  • Notifies users about errors and/or missing fields on checkout form submissions

Tech Stack

  • Next.js/React Framework
  • SCSS Styling
  • Sanity Headless CMS