<aside> 💬
일본 여행을 계획하는 한국 고객들이 쉽고 빠르게 일본에 있는 음식점을 예약할 수 있도록 돕는 서비스입니다.
언어 장벽 없이 간편하게 예약 대행 서비스를 이용하여 원하는 일본 음식점을 손쉽게 예약할 수 있습니다.
</aside>
sequenceDiagram
participant User as 사용자
participant Omotase as 오마타세 시스템
participant Admin as 어드민
User->>Omotase: 예약 생성 (인원, 날짜, 시간, 지도 URL 입력)
Omotase-->>User: 검증 (모든 필드 입력 확인)
User->>Omotase: 성함, 연락처 입력
Omotase-->>User: 검증 (성함, 연락처 입력 확인)
Omotase->>Admin: 예약 정보 전달
User->>Omotase: 예약 조회 (연락처 입력)
Omotase->>Omotase: DB에서 예약 정보 검색 및 검증
Omotase-->>User: 예약 내역 표시
Admin->>Omotase: 예약 가능 상태 변경
Omotase-->>User: 예약 가능 상태 반영
User->>Omotase: 예약 확정 클릭
Omotase->>Admin: 예약 확정 처리
Admin->>Omotase: 예약 불가능 상태 변경
Omotase-->>User: 예약 불가능 상태 반영
Admin->>Omotase: 예약자 일본어 이름 입력
User->>Omotase: 예약자 일본어 이름 보기 요청
Omotase-->>User: 예약자 일본어 이름 표시
src
┣ assets // 이미지 및 정적 파일
┣ components // UI 컴포넌트 모음
┣ pages // 주요 페이지 컴포넌트
┣ recoil // 전역 상태 관리
┣ routes // 라우터 설정
┣ util // 유틸리티 함수
┣ App.jsx // 메인 앱 컴포넌트
┗ index.js // 애플리케이션 진입점
<aside> 💡
사용된 주요 라이브러리
react-hook-form
: 폼 입력값을 쉽게 관리할 수 있도록 도와주는 라이브러리
recoil
: 상태 관리를 위한 라이브러리
styled-components
: 컴포넌트 스타일링을 위한 라이브러리
react-router-dom
: 페이지 이동을 위한 라이브러리
react-datepicker
: React에서 날짜를 선택할 수 있는 UI 컴포넌트를 제공하는 라이브러리
</aside>
예약 작성 폼 (Form
)
캘린더 제작
어드민 예약관리