다양한 체험을 제공하는 Frip을 모티브로 한 프로젝트
📆 2021.06.21 ~ 07.02
- 1st Sprint : 개발환경 초기세팅, 전체 레이아웃, 컴포넌트화
- 2nd Sprint : 컴포넌트 별 기능 구현, 프론트-백 통신, 코드 리팩토링, conflict 수정 작업
- React 기반의 커머스 홈페이지 제작
- CRA를 사용한 초기 세팅
- 2명의 팀원들이 공통
styled-component사용 - 공통부분인 Nav, Footer 컴포넌트 제작
- 카카오 로그인 API를 활용한 구성
- 카카오를 통해 Token을 받고 Backend와의 통신이 완료되면 Backend로부터 Token을 받아 Localstorage에 저장
- 카카오 로그아웃 API를 통해 로그아웃을 실행하고 성공하면 Localstorage에 저장 된 Token 삭제
- 상단 React-Slick 라이브러리를 활용한 빅배너 캐러셀 구현
- Best, New 상품 카드 형식으로 리스트 노출
- 클릭 시 검색페이지로 이동하는 상단바 노출
- 상품 찜하기 버튼 구현
- 상품 종류인 액티비티, 배움 상품 메뉴 리스트 구현
- 상품 종류별 서브카테고리 클릭 시 필터 적용된 상품 리스트 노출 구현
- 인기순, 평점순, 가격순 정렬 필터 구현
- Daum Postcode API를 활용한 주소 검색 기능 구현
- 액티비티 참여 날짜, 인원 수 선택 기능 구현
- 참여하기 클릭 시 사용자 정보, 참여 옵션 데이터 저장
- 검색창 활성화 시 인기 상품 fetch 받아 노출
- 인기 상품 클릭 시 해당 상품 상세 페이지 이동 기능 구현
- 검색 시 관련 상품 리스트 노출 및 관련 상품 없을 시 재검색 안내 페이지 노출 구현
이 프로젝트는 프립 사이트를 참조하여 학습목적으로 만들었습니다. 실무수준의 프로젝트이지만 학습용으로 만들었기 때문에 이 코드를 활용하여 이득을 취하거나 무단 배포할 경우 법적으로 문제될 수 있습니다. 이 프로젝트에서 사용하고 있는 사진 대부분은 위코드에서 구매한 것이므로 해당 프로젝트 외부인이 사용할 수 없습니다.