- 이 비디오에서는 Astro 및 Sanity를 사용하여 호텔 웹사이트의 예약 페이지를 구축하는 과정을 다룹니다. 🏨
- 이전 에피소드에서 Stripe 웹훅을 사용하여 예약 생성에 성공했으며, Sanity 스튜디오에서 이를 확인할 수 있습니다. ⬅️
- 예약 페이지에서는 특정 사용자의 예약 목록을 가져와 표시합니다. 🧑💼
- Astro.locals에서 사용자 ID를 추출하여 Sanity 스튜디오의 사용자 ID와 일치하는지 확인합니다. 🔑
- Sanity 클라이언트를 사용하여 Groq 쿼리를 통해 예약 스키마를 쿼리합니다. ❓
- 더 이상 외부 타입 파일이 필요 없으며, Sanity에서 제공하는 타입 생성을 위해 type gen 명령어를 실행합니다. ⚙️
- 예약 스키마에서 ID, 예약 ID, 체크인/체크아웃 날짜, 사용자 정보(이름), 방 정보(이름, 이미지), 상태, 성인/어린이 수, 방 수, 총 가격, 생성 날짜 등을 가져옵니다. 🛏️
- 예약 목록이 비어있을 경우 "예약이 없습니다" 메시지를 표시하고, 예약이 있을 경우 예약 정보를 매핑하여 표시합니다. ℹ️
- 예약 정보를 클릭하면 해당 예약 상세 페이지로 이동합니다. ➡️
- Sanity에서 이미지 URL을 가져와 표시하고, 날짜 형식을 지정하기 위해 유틸리티 함수를 사용합니다. 🖼️
- 사용자 정의 타입 정의를 통해 Sanity 타입 시스템의 한계를 극복하고 필요한 데이터 구조를 명확히 합니다. 💡
- 체크인/체크아웃 날짜와 가격 정보를 표시합니다. 📅
Build and Deploy a Full-Stack Hotel Website with Astro & Sanity
Recommanded Videos
