jonghoske / fe-sprint-coz-shopping Goto Github PK

상품 리스트 페이지

1. 서버에서 제공하는 상품 리스트들을 확인할 수 있는 페이지이며, 무한 스크롤을 통해 상품들을 계속 보여줄 수 있어야 합니다.

   • 무한 스크롤은 쿼리 파라미터를 통해 매번 API call을 하는 것이 아닌, 최초 1번의 API call을 통해 전체 데이터를 받아온 후 적용
     합니다.

2. 상품은 각 상품별로 타입이 존재합니다. (상품, 카테고리, 기획전, 브랜드)

3. 상단의 필터 버튼을 통해 상품을 타입 별로 조회해 보여줄 수 있어야 합니다.

4. 각 상품을 클릭하면 해당 상품의 사진을 보여주는 모달을 띄울 수 있어야 합니다.

5. 각 상품에 존재하는 북마크 버튼을 눌러 원하는 상품을 북마크 할 수 있어야 합니다.

6. 이미 북마크 된 상품의 경우, 북마크 버튼이 활성화 되어 있어야 합니다.

7. 활성화된 북마크 버튼을 클릭 시, 해당 상품이 북마크에서 삭제 되어야 합니다.

8. 북마크 버튼을 클릭하여 북마크에 추가할 때와 삭제할 때, 사용자에게 알림 토스트가 표시되어야 합니다.

Footer

1. 일련의 텍스트 정보들을 넣어줍니다. - [ v ]

메인페이지

1. 모든 타입의 상품 정보를 4개 보여줘야 합니다. (필터 기능은 구현하지 않습니다.)
   보이는 상품의 타입은 혼합되어 있어도 무방합니다. (상품, 카테고리, 기획전, 브랜드)

2. 모든 타입의 북마크 된 상품 정보를 4개 보여줘야 합니다. (필터 기능은 구현하지 않습니다.)
   보이는 상품의 타입은 혼합되어 있어도 무방합니다. (상품, 카테고리, 기획전, 브랜드)

3. 이미지 클릭 시 모달 창 만들기

Header

1. 메인 로고 클릭 시 / 페이지(메인 페이지)로 이동해야 합니다. - [ v ]

2. 햄버거 버튼

   2-1. OOO님 안녕하세요! 부분에는 본인의 이름을 넣습니다. - [ v ]

   2-2. 상품리스트: 클릭하면 /products/list 페이지로 이동해야 합니다. - [ v ]

   2-3. 북마크 페이지: 클릭하면 /bookmark 페이지로 이동해야 합니다. - [ v ]