Animal Crossing New Horizon at Sable's Clothing Store

Link to deployed website:

• https://acnh-clothing-shop.vercel.app/

Features

• Shopping Cart view

  • Add item from store to cart
  • Add item to cart only once
  • Display total cost in cart on cart page
  • Remove items from cart
  • Allow user to in input different quantities of the item in cart
  • When quantity in cart changes, need to update the total
  • CSS Grid: Align character/total cost on left and shopping list/buttons on right
  • Allow scrollable shopping list
  • Update cart with actual clothing items
  • Create confirmation modal for delete
  • Preview item display while in cart view
  • Create confirmation modal for adding multiple items

• Store Front view

  • Display how much an item cost
  • Display total cost in cart on the store page
  • CSS Grid: Align clothing items to make an upside down U with the character in middle and buttons on lower right
  • Update store with actual clothing items
  • Preview an item on character

Todos:

• Refactor!!
• use npm package json server as backend instead of store data file

How to get started

npm i
npm install @material-ui/core

Credits

• For the character artwork images by Ace S Chen Animal Crossing Character Maker

• For clothing items images from Animal Crossing Fandom