숙박 사이트, '좀쉼쉼'

personal•100%

DB 설계 및 DB User Table 활용, 로그인 인증 가능 숙박 사이트

링크

프로젝트 보기gitblog

프로젝트 개요

1

교육과정 프로젝트로, 'Client - Server - DB' 통신

2

직접 만든 Supabase DB로 검색, 예약 그리고 예약 확인까지 가능

기술 스택

  • Next js 14
  • Zustand
  • react-calendar
  • Supabase(PostgreSQL)

직면한 이슈

1. DB를 한번도 설계해본 경험이 없어

과제

프로토타이핑을 위한 DB 구축 및 관리 효율성 확보 필요

해결

Supabase를 활용하여 백엔드 없이 빠르게 DB 환경을 구성하고, user-accommodation-reservation 관계 설계 완료

2. React > Next.js 프레임워크 변경

과제

SSR (Server Side Rendering)에 대한 이해 및 적용, 숙소 정보 추가로 인한 가시성 및 가독성 높은 UI 구현

해결

Next.js SSR 전환으로 성능 개선(Lighthouse 78→85점) 및 네이버 파이낸셜 UI 패턴 참고로 일관된 사용자 경험 제공

3. 공지사항 페이지 (페이지 게시판 vs 무한 스크롤)

과제

공지사항 페이지에 적합한 UI 방식 선정

해결

공지사항 및 이벤트 페이지는 페이지별 목적에 맞춰 게시판 형태를 선택하여 구현