OurTrip

프로젝트 소개

• 항공권 숙박, 티켓, 투어, 액티비티 등을 예매할 수 있는 '마이리얼트립'을 모티브로 한 여행 예약 플랫폼 사이트 '아워트립' 제작
• 개발 기간 : 2022/06/07 ~ 2022/06/16 (10일)
• 시연 영상 : https://www.youtube.com/watch?v=n8d-xT8DhpA

팀원

Front-end

손가영	유하은	윤경연	최현민

Back-end

정병휘	최바다

기술 스택

Front-end

• HTML5
• Styled-Component
• JavaScript(ES6)
• React.js
• react-router
• slick (library)

Back-end

• Python
• Django
• MySQL
• Bcrypt
• pyjwt
• RESTful

Collaboration Tools

• Git
• GitHub
• Slack
• Trello

구현 페이지

• 메인 페이지
• 로그인 페이지
• 로딩 페이지
• 항공편 리스트 페이지
• 결제 페이지

내가 구현한 페이지

	Nav
설명	- useLocation을 사용하여 페이지 변화할 때마다 nav 스타일링이 변화 하도록 구현 - token 유/무에 따라 변화하는 nav bar 상단 바 구현

	Footer
설명	-ourtrip의 반복되는 카테고리를 상수데이터로 만들어 map함수를 적용

	마이 페이지
설명	-세가지의 카테고리는 useState에 저장해서 onClick 했을 때 어떤 컴포넌트를 보여줄 것인지 적용 -항공권을 예매하면 바로 마이페이지로 연결해 예정된 여행으로 보여줄 수 있도록구현

	예약 상세 페이지
설명	- useParams가 id값을 가져와 엔드포인트 뒤에 붙여줘 원하는 데이터를 백엔드에서 원하는 데이터를 요청 - 여행에 따라 다른 예약 상세페이지가 보여질 수 있도록구현

---

Reference

• 이 프로젝트는 마이리얼트립 사이트를 참조하여 학습목적으로 만들었습니다.
• 실무수준의 프로젝트이지만 학습용으로 만들었기 때문에 이 코드를 활용하여 이득을 취하거나 무단 배포할 경우 법적으로 문제될 수 있습니다.