[WEPLEATS] 1차 프로젝트 소개

WePleats 소개

• 개발자들의 개성있는 책상을 만들 수 있도록 보다 다채로운 색상의 프로덕트 판매하는 사이트를 기획하였습니다.
• 밋밋하고 칙칙한 개발자 책상이라는 편견은 이제 그만, WePleats는 하루종일 에서 일하는 개발자들의 개성을 표현해줄 수 있는 아이템을 추천해주는 곳입니다.

개발 인원 및 기간

• 개발기간 : 2022/9/19 ~ 2022/9/30
• 개발 인원 : 프론트엔드 3명, 백엔드 2명
• front-end github 링크

프로젝트 선정 이유

• 원래는 플리츠마마라는 가방 판매 사이트 클론을 하려고 했지만 이미지 저작권 문제 등으로 유니크한 커머스 사이

• 커머스 사이트 중에서 개발하는 데 기본적인 flow를 모둔 갖춘 사이트로 회원가입/로그인, 장바구니, 상품구매, 리뷰평 작성까지 모두 경험할 수 있어 선정하게 되었습니다.

데모 영상(이미지 클릭)

프로젝트 영상

구현 페이지

1. Nav, Footer

• 드롭다운 메뉴
• 회원가입, 로그인, 장바구니, 로그아웃 아이콘 클릭 시 해당 페이지로 이동
• 카테고리 클릭 시 해당 카테고리 리스트 페이지로 이동
• 로그인 시 유저아이디 보여줌
• 유저가 장바구니에 제품을 담으면 몇 개 담았는지 표기

2. 회원가입 & 로그인

• (유효성1) 회원가입 시 이메일 형식으로 아이디를 입력해야 함
• (유효성2) 비밀번호 입력 시 영문 대/소문자, 특수문자, 숫자 필수 포함

3. 메인

• 스크롤 시 화면 애니메이션 효과
• 슬라이드 기능

4. 제품 리스트(상품 카테고리/색상 필터)

• 제품 카테고리 메뉴 클릭 시 리스트 페이지로 이동
• 카테고리 내에 색상별 필더링 기능

5. 제품 상세 & 리뷰

• 제품명/가격/이미지/정보 보여주는 상세페이지
• 구매하기/장바구니 버튼 입력 시 해당 페이지로 이동
• 수량 버튼 클릭 시 총금액 같이 변함
• 구매한 제품은 하나의 구매평 작성 가능
• 작성한 구매평 수정 또는 삭제 가능

6. 장바구니

• 상제페이지에서 장바구니에 담은 제품 장바구니 페이지에서 보여짐
• 체크한 제품만 결제할 금액 보여짐
• 체크한 제품만 삭제 또는 결제 따로 가능

7. 결제

• 회원가입시 지급된 포인트로 결제 금액에서 차감이 가능