인테리어 커머스 사이트 프로젝트
프로젝트 기간이 길지 않아 전체가 아닌 일부 기능에 집중해 기획했습니다.
개발은 초기 세팅부터 전부 직접 구현했으며, 아래 데모 영상에서 보이는 부분은 실제 사용할 수 있는 서비스 수준으로 개발한 것입니다.
개발기간 : 2021/8/17 ~ 2021/8/27
프론트엔드 : 이지선, 최정민, 남재현
백엔드 : 장호준, 송진수
백엔드 깃헙 주소 : https://github.com/bigfanoftim/23-2nd-Homestagram-backend
게시글 속 태그를 통하여 커뮤니티와 커머스 기능을 결합한 점에 매력을 느끼고, 이에 모티브를 얻어 OpenMarket은 존재한다는 가정하에 SNS기능에 집중하여 프로젝트를 진행하였습니다.
https://youtube.com/watch?v=ZxATcPFrrqg
적용 기술 및 구현 기능
Front-End : HTML5, React, JavaScript
Back-End : Python, Django web framework, Bcrypt, PyJWT, MySQL
Common : AWS(RDS/EC2/S3), KAKAO social login, PayPal API, RESTful API
Communication: Slack, Trello, Goolge Docs
- CRA를 이용한 초기셋팅
- Footer
- 모달 창을 이용한 회원추가 정보 가입
- Kakao Api를 사용하여 로그인
- 카카오 소셜 로그인 API를 통한 유효성 검사
- JWT 토큰 발행 후 닉네임 설정, 사이트 내 로그인 수행
- 모달창을 통해 피드 작성
- 이미지 업로드 및 description 입력
- 이미지 속 원하는 위치에 태그를 추가하여 구매한 목록을 중 해당되는 상품을 선택하여 매치할 수 있는 기능
- 업로드 한 피드들이 보여짐
- 피드 사진에 마우스 호버시 추가되어있는 태그들이 나타남
- 태그 클릭 시 매치되어있는 상품정보가 뜨는 기능
- 유저간 팔로우 기능 구현
- 피드 페이지의 피드 사진에 태그에 매치되어있는 상품을 클릭하면 상세페이지로 이동
- 제품의 옵션 선택 기능 구현
- 가격을 계산하여 구매 페이지로 보냄
- 다음 우편번호 Api를 사용하여 주소 검색
- 최종 결제 금액 계산
- 마음에 드는 피드를 북마크하여 내 정보에 보관
- 페이팔 Api를 사용하여 결제 시스템 구현
- 구매 영수증을 검증하여 구매목록(히스토리)에 보관