/react-shopping-cart

⚛️ React 장바구니 애플리케이션 🛒

Primary LanguageTypeScript

react-shopping-cart

기능 요구 사항

  • /cart-items API를 호출하여 장바구니 상품 데이터를 불러온다.
  • 불러온 데이터를 기반으로 Recoil을 사용하여 클라이언트 장바구니 상태를 관리한다.
    • 장바구니 상품의 다양한 상태(장바구니 상품 목록)를 Atom으로 관리한다.
    • 결제 금액, 배송비 등의 파생 상태를 Selector를 통해 계산한다.
    • 개별 상품의 선택 여부, 결제 금액, 배송비 등의 상태를 Recoil로 관리한다.
  • 상품 선택에 따른 결제 금액, 배송비 등의 동적인 변경 사항을 처리한다.
    • 결제 금액이 10만원 이상일 경우 배송비는 무료이다.
    • 상품 선택/해제 시 결제 금액을 동적으로 변경한다.
  • 장바구니 상품의 수량 변경을 할 수 있다.
  • 장바구니에 담긴 상품을 제거할 수 있다.
  • 새로고침해도 선택한 상품 상태를 유지해서 보여준다.
  • RTL을 사용하여 주요 기능에 대한 테스트 케이스를 작성한다.
    • /cart-items API 호출을 통해 초기 장바구니 데이터를 정상적으로 불러오는지 테스트한다.
    • 상품 선택 기능: 개별 상품의 선택/해제 시 선택 여부가 정상적으로 변경되는지 테스트한다.
    • 결제 금액 계산: 선택된 상품들의 가격 합계가 결제 금액으로 정상 반영되는지 테스트한다.
    • 배송비 계산: 결제 금액에 따라 배송비가 정상적으로 계산되는지 (10만원 이상 무료) 테스트한다.
    • 수량 변경 기능: 상품의 수량을 변경할 때 올바르게 반영되는지 테스트한다.
    • 상품 제거 기능: 장바구니에서 상품을 제거할 때 정상적으로 동작하는지 테스트한다.