하루숙 사업장 운영 웹앱
본 요구사항(다중 계정 전환, 계정 간 데이터 격리, 셀프 온보딩, 베드24 계정 연결, 로그인 기기 관리, 역할별 권한 표)을 반영한 숙박업소 운영 웹앱 맞춤 구현한 프로젝트입니다.
프로젝트 개요
본 요구사항(다중 계정 전환, 계정 간 데이터 격리, 셀프 온보딩, 베드24 계정 연결, 로그인 기기 관리, 역할별 권한 표)을 반영한 숙박업소 운영 웹앱 맞춤 구현한 프로젝트입니다. 첫 화면은 사업장 스위처와 오늘 체크인·체크아웃 요약으로 구성했습니다.
작업 범위
- 운영 홈: 호스트가 사업장 스위처로 가입한 사업장을 바꾸고 오늘 체크인·체크아웃·점유 객실과 채널 예약을 한 화면에서 봅니다. 온보딩이 남은 사업장은 단계 체크리스트가 위에 나타납니다
- 온보딩: 신규 호스트가 사업장 정보, 베드24 연결, 숙소 가져오기, 공동호스트 초대, 완료 5단계를 스스로 마칩니다. 베드24 API 키를 입력하면 계정명과 숙소 수가 확인됩니다
- 기기 관리: 호스트가 로그인된 기기 목록에서 브라우저·위치·마지막 활동을 확인하고 특정 기기를 원격 로그아웃합니다. 새 기기 로그인 알림 설정과 알림 예시도 같은 화면에 있습니다
- 권한 표: 대표가 역할별(대표·매니저·프런트·청소·읽기 전용) 조회·생성·수정·삭제 가능 범위를 표로 확인하고 수정합니다. 사람 추가는 역할과 숙소 쌍으로 배정합니다
주요 업무
- 운영 홈 화면: 좌상단 사업장 스위처(이름·도시·숙소 수·검색), 오늘 요약 카드, 오늘 할 일 목록, 온보딩 N/5 체크리스트 카드를 설계합니다. 사업장을 바꾸면 모든 조회가 선택한 사업장 범위로 다시 계산됩니다
- 온보딩 화면: 왼쪽 단계 목록과 오른쪽 폼의 5단계 위자드를 설계합니다. 가져오기 단계는 숙소별 성공·실패 결과 표를 보여 주고 실패 사유를 함께 표시합니다
- 기기 관리 화면: 기기 표, 현재 세션 표시, 다른 모든 기기 로그아웃 확인 대화상자, 새 기기 알림 토글과 알림 예시 카드를 설계합니다. 알림 채널은 이메일로 가정합니다
- 권한 표 화면: 역할 열과 기능 행의 권한 매트릭스, 역할 선택 시 열리는 기능 묶음 토글과 숙소별 배정 패널을 설계합니다. 같은 권한 정의를 슈퍼어드민 화면의 권한 검사 현황도 사용합니다





프로젝트 핵심 과제
기존 코드에 테넌트 조건이 없는 쿼리가 남아 있을 경우를 대비해 쿼리 목록을 전수 점검하는 절차 설계
베드24 API 응답이 숙소마다 다른 형식일 때 일부 실패를 허용하며 가져오는 매핑 설계
새 기기 알림 발송 채널이 정해지지 않아 이메일을 가정하되 채널을 바꿀 수 있는 발송 인터페이스 설계
한 사람이 사업장마다 다른 역할을 갖는 경우의 권한 판정 규칙 설계
핵심 기능 상세
운영 홈
호스트가 사업장 스위처로 가입한 사업장을 바꾸고 오늘 체크인·체크아웃·점유 객실과 채널 예약을 한 화면에서 봅니다. 온보딩이 남은 사업장은 단계 체크리스트가 위에 나타납니다.
- 세션 토큰에 사업장 ID를 담고 Hono 미들웨어가 모든 D1 쿼리에 테넌트 조건을 주입하는 구조 설계
- 사업장 전환 시 React 상태와 조회 캐시를 사업장 키로 분리해 이전 사업장 데이터가 남지 않도록 구현
- 체크인·체크아웃 요약을 D1 집계 쿼리 한 번으로 만들어 홈 카드가 같은 숫자를 쓰도록 구성
계정 간 데이터 격리를 화면이 아니라 API 미들웨어와 쿼리 단계에서 강제해 어느 화면에서도 다른 사업장 데이터가 보이지 않도록 설계합니다.


온보딩
신규 호스트가 사업장 정보, 베드24 연결, 숙소 가져오기, 공동호스트 초대, 완료 5단계를 스스로 마칩니다. 베드24 API 키를 입력하면 계정명과 숙소 수가 확인됩니다.
- 베드24 API 키를 Workers 시크릿 암호화 저장소에 보관하고 검증 호출 결과만 D1에 기록하는 구조 설계
- 숙소 가져오기를 숙소 단위로 나눠 일부 실패해도 성공 건은 등록되는 부분 성공 처리 구현
- 온보딩 진행 단계를 D1에 저장해 중간에 나가도 마지막 단계에서 이어 하도록 구성
기존 베드24 연동 로직을 계정별 토큰으로 호출하도록 감싸 가입 고객이 자신의 베드24 계정을 직접 연결하는 흐름을 설계합니다.


기기 관리
호스트가 로그인된 기기 목록에서 브라우저·위치·마지막 활동을 확인하고 특정 기기를 원격 로그아웃합니다. 새 기기 로그인 알림 설정과 알림 예시도 같은 화면에 있습니다.
- 세션을 D1 세션 테이블에 기기 지문과 함께 저장하고 로그아웃 시 해당 행을 폐기하는 구조 설계
- 요청마다 세션 유효성을 확인하는 Hono 미들웨어로 원격 로그아웃이 즉시 적용되도록 구현
- 처음 보는 기기 지문이 로그인하면 알림 큐에 이메일 발송 작업을 등록하는 흐름 설계
세션 폐기를 토큰 만료에 기대지 않고 서버 세션 테이블에서 즉시 처리해 원격 로그아웃이 바로 적용되도록 설계합니다.


권한 표
대표가 역할별(대표·매니저·프런트·청소·읽기 전용) 조회·생성·수정·삭제 가능 범위를 표로 확인하고 수정합니다. 사람 추가는 역할과 숙소 쌍으로 배정합니다.
- 역할별 권한 정의를 D1 한 곳에 두고 Hono 권한 미들웨어가 라우트마다 같은 함수로 검사하는 구조 설계
- 역할과 숙소 배정을 별도 테이블로 분리해 한 사람이 숙소마다 다른 역할을 갖도록 구현
- 권한 표 화면과 API 검사가 같은 정의를 읽어 화면과 서버 결과가 어긋나지 않도록 구성
흩어진 권한 검사 로직을 미들웨어 한 곳으로 모아 새 라우트가 추가돼도 같은 검사를 거치도록 설계합니다.


프로젝트 진행 단계
테넌트 구조와 데이터 스키마 설계 · 2026.11
사업장·사용자·역할 테이블과 D1 쿼리 테넌트 조건 규칙 정의
권한 미들웨어와 세션 API 개발 · 2026.11
Hono 권한 검사 미들웨어, 세션 폐기 API, 새 기기 알림 흐름 구현
베드24 연결과 숙소 가져오기 구현 · 2026.11
계정별 API 키 검증과 숙소 단위 부분 성공 가져오기 구현
온보딩·운영 홈 화면 개발 · 2026.11
사업장 스위처, 5단계 위자드, 권한 표 React 화면 구현
개발 결과
기술적 주안점
- 계정 간 데이터 격리를 화면이 아니라 API 미들웨어와 쿼리 단계에서 강제해 어느 화면에서도 다른 사업장 데이터가 보이지 않도록 설계합니다
- 기존 베드24 연동 로직을 계정별 토큰으로 호출하도록 감싸 가입 고객이 자신의 베드24 계정을 직접 연결하는 흐름을 설계합니다
- 세션 폐기를 토큰 만료에 기대지 않고 서버 세션 테이블에서 즉시 처리해 원격 로그아웃이 바로 적용되도록 설계합니다