구현 영상입니다.
구현 영상입니다.
Justbnb
https://github.com/dlwjdals22/justcode-4-2nd-justbnb-front
- 기간 : 2022. 04. 18 ~ 2022. 04. 29
- 프로젝트 구현 영상 : Youtube 링크
- 모티브로 삼은 사이트 : Airbnb
- 인원 : Front-end 5명, Back-end 1명
프로젝트 설명
에어비앤비라는 숙박 정보를 제공하는 사이트의 디자인과 기획을 토대로 개발한 프로젝트입니다.
담당한 부분
- Reservation 페이지 UI 구현 (구현 영상 재생시간 3:11)
- Management 페이지 UI 구현 및 기능 추가 (구현 영상 재생시간 3:32)
- 캐러셀
- 캐러셀이 첫 번째 또는 마지막에 도달할 시 버튼 비활성화 구현
- 호스팅페이지(Step 3) UI 및 기능 구현 (구현 영상 재생시간 0:35)
- 카카오맵 API 연동 및 구현
- 서울, 부산, 제주, 도시 버튼 클릭 시 해당 지역으로 맵 이동 구현
- 위도, 경도 정보 추출 및 다음 단계로 데이터 전달 구현
- 상세주소 정보 추출 및 다음 단계로 데이터 전달 구현
- 호스팅페이지(Step 7, 8) (구현 영상 재생시간 0:54)
- 호스팅페이지(Step 9) (구현 영상 재생시간 1:13)
- 사진 여러 장 업로드 기능 구현
- 업로드된 사진들 미리보기 구현
- 업로드 시 opacity 속성을 이용한 UI 변경 구현
- ‘완료’ 시 alert 창 발생, 메인페이지 라우팅 구현