Build and Deploy a Full-Stack Hotel Website with Astro & Sanity
- 해당 비디오에서는 Astro 및 Sanity를 사용하여 풀 스택 호텔 웹사이트에 고객 리뷰를 표시하는 방법을 설명합니다. 🏨
- 먼저, 리뷰를 표시할 위치를 정하고, room ID를 기반으로 특정 방에 대한 리뷰를 가져오기 위해 review.tsx 컴포넌트를 생성합니다. 🧩
- Sanity 클라이언트를 사용하여 승인된 리뷰를 쿼리하고, 최신 리뷰를 먼저 표시하도록 정렬합니다. ✅
- 리뷰가 없는 경우, 특정 텍스트를 표시하고, 리뷰가 있는 경우, 리뷰를 매핑하여 각 리뷰를 표시합니다. 💬
- 리뷰의 길이를 확인하여 리뷰가 있는지 확인하고, 리뷰가 없는 경우 특정 메시지를 표시합니다. 🔍
- 리뷰가 있는 경우, 리뷰를 매핑하고, 각 리뷰에 대해 테두리, 그림자, 간격 등의 스타일을 적용합니다. ✨
- 리뷰의 생성 날짜, 평점, 사용자 이름, 댓글 등의 정보를 표시합니다. 🗓️
- Sanity type gen을 사용하여 리뷰에 대한 타입을 생성하고, 사용자 타입을 생략하고 사용자 정의 타입을 생성하여 사용자 정보를 표시합니다. 👤
- 별 아이콘을 사용하여 평점을 표시하고, 사용자 이름과 댓글을 표시합니다. ⭐
- 최종적으로, 고객 리뷰가 웹사이트에 성공적으로 표시되는 것을 확인합니다. 🎉