react ecommerce

JobsImulator.dev에 의해 전자 상거래에 반응합니다

이것은 React 및 Tailwindcss로 만든 간단한 전자 상거래 사이트입니다. 귀하의 임무는 8 가지 문제를 해결하는 것입니다.

1. 가격 및 출시 날짜별로 제품을 정렬하십시오
2. 새로 고침에 카트 지속성
3. 제품 필터 기능을 추가하십시오
4. 제품 페치는 무한 루프를 유발합니다
5. 카트 페이지에서 카트가 비어있을 때 '빈 카트'를 표시해야합니다.
6. 카트 크기로 NAV에서 카트를 업데이트하십시오
7. 사용자가 회색 영역을 클릭하면 카트가 닫히지 않습니다
8. 카트 페이지에서 하위 토탈이 구현되지 않습니다

학습 목표

연습하고 경험을 쌓을 것입니다.

• Tailwindcss가있는 스타일링 웹 앱
• 반응 후크 사용 (usestate, useeffect)
• 데이터 조작, 집계, 정렬 및 표시
• React에서 테이블 작업
• 쇼핑 카트 구현
• 로컬 스토리지로 작업합니다
• 통화 형식
• API에서 데이터를 가져 오기

작업을 시작하는 방법

1. 이 저장소를 포크하고 로컬로 복제하십시오.
2. npm i
3. npm run dev:frontend 실행하여 Frontend를 시작하고 npm run dev:backend 시작하여 백엔드를 시작하여 앱을 로컬로 실행하십시오.
4. 사이트를 보려면 http : // localhost : 3000을 방문하십시오.
5. 모든 문제를 수정합니다 (힌트는 코드에서 TODO 주석으로 제공됩니다)
6. 모든 솔루션이 완료되면이 저장소에 단일 풀 요청을 작성하십시오.
7. 솔루션이 자동 테스트를 통과하는지 확인하십시오.

도움이 필요하십니까?

도움을 요청하는 가장 좋은 방법은 불화 커뮤니티에 요청하는 것입니다.

JobSimulator.dev Discord에 가입하려면 여기를 클릭하십시오.

더 많은 도전을 원하십니까?

새로운 도전이 발표 될 때 도전 목록을 탐색하고 불화에 가입하십시오.