빌드 케이스: 미팅 예약 시스템 (우리집인테리어디자인)¶

단톡방 수동 조율 → 웹앱 자동 시스템으로 전환한 전 과정 기간: 2026-03-26 (하루)

문제¶

CS팀이 고객 문의를 받고 단톡방에 올림
디자인팀이 구글 시트를 열어서 날짜/시간을 직접 입력
고객에게 수동으로 문자/카톡 발송
확정 여부 추적이 안 됨
미응답 건이 묻히기 쉬움

해결¶

5개 페이지 웹앱으로 전 과정 자동화:

CS팀 등록 → 디자인팀 링크 확정 → 고객 링크 확인 → 캘린더 자동 등록

의사결정 과정¶

1단계: 요구사항 파악¶

기존 단톡방 양식 텍스트 분석 (미팅 스케줄(내부용) 구조 예시.txt)
기존 Apps Script v1 코드 분석
3가지 사용자(CS팀/디자인팀/고객) 각각의 니즈 정리

2단계: 설계 결정¶

결정	선택	이유
아키텍처	하나의 웹앱, URL 파라미터로 분기	배포 1번이면 끝
데이터	구글 시트 (v1), D1 (v2)	시트는 프로토타입에 최적
인증	PIN (내부) + 토큰 (고객)	최소한의 보안, 최대한 간편
상태 관리	5단계 (조율중→고객확인중→확정→완료→취소)	누가 액션해야 하는지 명확

3단계: 반복 개선 (미리보기 기반)¶

기본 플로우 구현
역제안 단답형 추가 ("4월 3일 오전은 어떠실까요?")
고객 전달 코멘트 추가 ("이 일정이 어려우시면 4월 5일도 가능합니다")
대시보드 추가 (통계 + 카드 목록 + 상세 팝업)
단톡방 복사 메시지 (등록 시 + 확정 시)
24시간 리마인더 자동 발송
메시지 톤 조정 (검토용 텍스트 파일로 관리)
PIN 보안 추가
Cloudflare 이전 결정 (속도/URL/디자인)

4단계: 플랫폼 이전¶

Apps Script: 기능 검증용 (프로토타입)
Cloudflare Workers: 실서비스용 (속도 + 커스텀 도메인)

핵심 기능 목록¶

기능	설명
붙여넣기 자동채우기	단톡방 텍스트 → 폼 필드 자동 분배
단답형 역제안	날짜 선택 없이 메시지만 보내기
고객 전달 코멘트	확정할 때 추가 메시지 함께 발송
고객 확인 버튼	고객이 "확인" 누르면 최종 확정
고객 변경 요청	고객이 다른 일정 제안 → 디자인팀에 자동 알림
변경 요청 강조	디자인팀 페이지에 "고객이 이렇게 요청했어요" 카드
24시간 리마인더	미응답 시 고객에게 자동 재발송 (1회)
대시보드 상세 팝업	카드 클릭 → 전체 내역 확인 + 리마인더 버튼
단톡방 복사 메시지	등록 시 + 확정 시 자동 생성 → 복사 버튼
상태별 조건 표시	고객확인중일 때만 리마인더, 확정일 때만 복사 메시지
지역/진료과 태그	참고사항에서 자동 추출 → 카드/이메일에 표시

메시지 관리 패턴¶

코드에 하드코딩하면 비개발자가 수정 못 함. 해결: 1. 모든 고객 메시지를 텍스트 파일로 추출 (고객메시지_검토용.txt) 2. 비개발자가 직접 수정 3. 수정 내용을 코드에 반영

메시지 종류 9개: - 이메일 4개 (제안/역제안/단답형역제안/리마인더) - SMS 4개 (동일 구성) - 수동 발송 1개 (이메일+SMS 불가 시 복사용)

실수 & 교훈¶

실수	원인	해결
시간이 "Sat Dec 30 1899 14:00:00"으로 나옴	구글 시트가 "14:00"을 Date로 자동 변환	쓸 때 `setNumberFormat('@')`, 읽을 때 Date instanceof 체크
고객 변경 요청이 메일에 안 나옴	데이터 업데이트 전의 old data로 메일 발송	업데이트 후 `getRowData` 다시 호출
장소 "추후 안내"가 혼란	미선택 시 기본값이 "추후 안내"	빈 문자열 반환 + 조건부 표시 (없으면 아예 안 보임)
미리보기에서 탭 간 데이터 안 연동	정적 HTML이라 탭이 독립적	디자인팀 액션 시 고객 탭 데이터를 JS로 동기화
"맞춰드리겠습니다"	실제로 못 맞출 수도 있음	"최대한 조율해보겠습니다" (약속→노력)

파일 구조¶

Apps Script 버전 (프로토타입)¶

D:\woorijipinterior\apps\meeting-scheduler\
├── Code.gs              # 서버 로직 전체 (~1200줄)
├── Style.html           # 공통 CSS
├── PagePin.html         # PIN 인증
├── PageCS.html          # CS팀 등록
├── PageDesign.html      # 디자인팀 확정
├── PageCustomer.html    # 고객 확인
├── PageDashboard.html   # 대시보드
├── preview.html         # 로컬 미리보기 (4탭 통합)
├── 고객메시지_검토용.txt  # 메시지 검토/수정용
└── Code_v1_backup.gs    # v1 백업

Cloudflare 버전 (실서비스)¶

D:\Sites\woori-meeting\
├── src/index.ts         # Hono 서버 (API 전체)
├── public/              # 정적 프론트엔드
|   ├── pin.html
|   ├── cs.html
|   ├── design.html
|   ├── customer.html
|   └── dashboard.html
├── schema.sql           # D1 DB 스키마
├── wrangler.toml        # Cloudflare 설정
└── package.json

작업 순서 (효율적이었던 점)¶

기존 요구사항 문서 분석 → 이미 있는 txt 파일에서 플로우 파악
전체 아키텍처 한번에 설계 → 나눠서 하면 나중에 갈아엎게 됨
코드 + HTML 동시 생성 → 서버와 프론트를 따로 만들면 인터페이스가 안 맞음
미리보기 HTML로 빠른 피드백 → Apps Script 배포 없이 UI 확인
메시지를 텍스트 파일로 분리 → 비개발자 검토 가능
Apps Script로 실 테스트 → 실제 이메일 발송, 시트 기록 확인
확정된 스펙으로 Cloudflare 이전 → 스펙이 명확하니 이전이 빠름