Skip to content
/ SCBJ-FE Public

무료 예약 취소 불가한 숙소의 양도/거래 플랫폼 "숙취방지"

Notifications You must be signed in to change notification settings

SCBJ-7/SCBJ-FE

Repository files navigation


📝 프로젝트 소개

가격 걱정 없이 합리적인 가격으로 득텔 하세요!

사기매물과 과도한 리셀 프리미엄으로 인해 신뢰도가 낮았던 숙소 양도거래를 혁신합니다. 국내 최대 숙박 플랫폼 야놀자에서 인증이 된 상품만을 취급합니다. 또한 과도한 프리미엄이나 흥정을 불가능하며 사용하지 못할 상품을 원하는 가격에 지정하고 N시간 안에 안 팔리면 2차 할인 가격으로 다운되는 구조를 가지고 있습니다.

배포 링크

배포 사이트 배포 레포

관련 링크

wiki API figma

🎯 개발 기간

2023.1.2 - 1.27

🧑🏻‍💻 팀 소개 및 역할

팀원 | 박나영 팀원 | 윤석민 팀원 | 이영욱 팀장 | 정범환 팀원 | 채민석
@im-na0 @dbstjrals @wowba @Bumang-Cyber @chaeminseok
  • 마이페이지
  • 계좌 등록 페이지
  • 글로벌 스타일 설정
  • 초기 프로젝트 설정
  • 로그인페이지
  • 회원가입페이지
  • 메인페이지
  • 판매글 작성 페이지
  • 알림페이지
  • 헤더, 바텀 네비게이션 공통 컴포넌트
  • 전역상태관리 세팅
  • 인터랙션

📃 테스트 아이디 / 비밀번호

테스트 아이디 1: @naver.com 비밀번호: xxxxx

🛠️ 기술 스택

언어 & 개발환경

React Vite TypeScript

비동기통신 및 캐싱

Axios React query

전역상태 관리

zustand

CSS 및 인터랙션 라이브러리

Styled Components Framer

버전관리 및 CI/CD

Git GitHub

협업

Discord Notion

✔️ 야놀자 RFP 구현 사항

  • 회원은 회원가입을 할 수 있습니다.

  • 기본 정보는 ID 역할로 이메일 주소를 사용하고, 그 외에 비밀번호와 이름입니다.

  • 데이터베이스에는 암호화된 비밀번호가 들어가야합니다.

  • 이메일과 비밀번호로 로그인할 수 있습니다.

  • 회원 정보를 저장해둔 데이터베이스를 검색하여 해당 사용자가 유효한 사용자인지 판단합니다.

  • 로그인을 하지 않아도 상품을 확인할 수 있습니다.

  • 회원은 판매자와 구매자 모두 가능합니다.

  • 지역/날짜별 양도 상품을 확인할 수 있습니다.

  • 원래 구매금액과 양도 상품의 금액을 모두 확인할 수 있습니다.

  • 구매한 상품의 가격 정보를 확인할 수 있습니다.

  • 예약 상품을 상세하게 확인하고 이를 기반으로 체크인을 안전하게 완료할 수 있어야 합니다.

  • 내가 구매했으나 양도할 상품을 확인하고 선택할 수 있어야 합니다.

  • 양도 완료 이후 판매금액, 수수료금액 등 관련 정산 정보를 확인할 수 있어야 합니다.

  • 양도 상품의 희망 거래가격을 설정할 수 있어야 합니다.

  • 안전한 C2C 거래 결제 시스템을 제공해야 합니다.

🎨 페이지 별 디자인 및 기능

메인페이지

판매글 작성 페이지

판매글 작성 성공 페이지

상세페이지

🗂️ 파일 구조

📂 src
┣ 📂 api
┣ 📂 assets                   # 폰트, 이미지 ,아이콘
┣ 📂 constant                 # 상수
┣ 📂 mock                     # msw 더미 데이터
┣ 📂 components               # 공용 컴포넌트
┃  ┣ 📂 Modal
┃  ┣ 📂 SideBar
┃  ┣ ...
┣ 📂 constant
┣ 📂 contexts                 # 소켓 컨택스트
┃  ┣ ChatSocketContext.tsx
┃  ┣ ...
┣ 📂 hooks                    # 커스텀훅
┣ 📂 pages                    # 페이지 컴포넌트
┃  ┣ 📂 homePage
┃  ┣ 📂 alarmPage
┃  ┣ 📂 payment
┃  ┃  ┣ 📂 paymentButton      # 페이지 내 컴포넌트 폴더
┃  ┃  ┣ Payment.style.ts
┃  ┃  ┣ Payment.tsx
┃  ┣ ...
┣ 📂 routes
┣ 📂 utils
┣ 📂 stores                   # 전역상태
┣ 📂 styles                   # 스타일테마
┣ 📂 types                    # 타입스크립트 공용 인터페이스
┣ 📂 test                     # 테스트 코드
┣ App.tsx
┣ index.tsx

📍 컨벤션

커밋 컨벤션
feat 새로운 기능 추가
fix 버그 수정
style 코드 스타일 수정 (세미 콜론, 인덴트 등의 스타일적인 부분만)
design css 등 디자인 추가 및 수정
refactor 코드 리팩토링
comment 주석 추가/수정
docs 내부 문서 추가/수정
test 테스트 추가/수정
chore 빌드 관련 코드 수정
remove 파일 삭제

💭 느낀점 및 회고

  • 박나영

    • (예시) 실시간 서버 통신을 구현하면서 정말 재밋게 배웠던 프로젝트였습니다. 그리고 팀원들과 같은 어려움을 겪으면서 해결방법을 공유했던 것도 정말 좋은 경험이 되었습니다!
  • 정범환

    • PM/UX/BE 직군 모두와 협업하기 적극적인 의사소통과 질문하는 문화를 만들었습니다. 각자 자신의 업무만 하는 것이 아니라 다른 팀원의 업무도 도와줄 수 있으면 적극적으로 도울 수 있는 팀플레이를 만드려고 하였습니다. 팀원 이탈이 많은 프로젝트였고 다들 넓은 범위를 커버하느라 수고가 많았지만 잘 버텨주셔서 감사한 프로젝트였습니다!
  • 채민석

    • 가문의 영광입니다!

About

무료 예약 취소 불가한 숙소의 양도/거래 플랫폼 "숙취방지"

Resources

Stars

Watchers

Forks

Packages

No packages published