|||

K-Wave Now

경험이 설계를 하는 AI 시대, 새로운 프로젝트 개발론
AdvertisementLeaderboard Ad
Back to Edition
Project

Dental Lab Pan-Tracking System

K-
By Hey VibePublished 2026년 9월 22일

모든 케이스의 진행 상황을 실시간으로 추적하고, 청구/수금(A/R)까지 원스톱으로 관리하는 통합 SaaS(Multi-Tenant) 플랫폼 구축

HeyVibe Dental Lab Pan-Tracking System (DLPTS)

본 문서는 현재까지 개발된 HeyVibe 치과 기공소 통합 관리 시스템(DLPTS)의 V1(프리젠테이션 데모) 단계까지의 개발 내용을 정리한 프로젝트 보고서입니다. 이 문서는 클라이언트 보고용 및 향후 V2 고도화에 참여할 개발 에이전트/팀과의 지식 공유 목적으로 작성되었습니다.

1. 최초 개발 기획 및 목표

프로젝트 배경

치과 기공소(Dental Lab)의 업무는 병원으로부터 의뢰를 받아 여러 공정(디자인, 밀링, 3D 프린팅, 빌드업 등)을 거쳐 최종 보철물을 출고하는 복잡한 프로세스를 가집니다. 기존에는 종이 작업지시서(Lab Slip)와 수작업에 의존하여 진행률 파악이 어렵고, 병원-기공소 간 소통 비용이 컸습니다.

개발 목표

"모든 케이스의 진행 상황을 실시간으로 추적하고, 청구/수금(A/R)까지 원스톱으로 관리하는 통합 SaaS(Multi-Tenant) 플랫폼 구축"

  • 기공소 내부의 생산성 및 공정 가시성 극대화 (Pan Tracking).

  • 본사(HQ)에서 산하 네트워크 기공소들의 실적 및 운영 현황을 통합 모니터링.

  • 치과 병원과 기공소 간의 투명한 커뮤니케이션 채널 제공.

  • 성공적인 투자 유치 및 클라이언트 미팅을 위한 완벽한 V1 데모(시연용) 시스템 확보.

2. 주요 개발 사항

현재 v1-presentation-demo 브랜치 기준으로 구현이 완료된 핵심 기능은 다음과 같습니다.

2.1 본사(HQ) 통합 대시보드 및 관리 시스템

  • 통합 대시보드: 전체 진행 중인 케이스 수, 지연(Past Due) 케이스, 자금 흐름(A/R), 로케이션별 팬(Pan) 위치 현황 등을 한눈에 파악.

  • A/R (미수금) 관리 모듈: 치과 병원별 총 청구액, 수금액, 미수금 잔액(Net Balance) 및 크레딧(Overpayment) 관리 기능. 일괄 결제(Bulk Payment) 적용 로직 구현.

  • 케이스(Case) 관리: 바코드 기반 케이스 추적, 엑셀 대량 업로드 대비용 UI, 병원 및 랩 할당 기능.

2.2 기공소(Lab) 현장 업무 시스템

  • 스캐너 폼 (Barcode Scanning): 공용 태블릿이나 PC에서 바코드 스캐너를 이용해 팬(Pan) 바코드를 연속 스캔하여 현재 공정(Workstation)으로 상태를 업데이트하는 기능. (연속 스캔 및 2초 대기 시 자동 일괄 전송 로직 적용)

  • 출고(Dispatch) 관리: 해당 기공소에 할당된 케이스 중 출고 대기 중인 항목들을 확인하고 배송 처리하는 기능.

2.3 시스템 공통 및 글로벌 대응

  • 영문화 (Localization): 데모 시연을 위해 로그인 페이지의 한국어 안내(업무 확인요청 등)를 제외한 시스템 전체 UI 및 Alert/Toast 알림 메시지를 영문으로 변환 (HeyVibe 브랜딩 적용).

  • 접근 제어 (Middleware 보호): 인증되지 않은 사용자는 접근할 수 없도록 Next.js Middleware를 통한 라우팅 보호 및 예외 페이지(/policy-questions) 설정.

3. 구현 방법, 기술 스택 (Tech Stack) 및 핵심 기술

3.1 기술 스택

  • 프론트엔드 (Frontend):

    • Framework: Next.js (App Router)

    • UI Library: React

    • Styling: Tailwind CSS (반응형 및 모바일 최적화)

    • Components: shadcn/ui 기반의 커스텀 UI (Card, Badge, Toast 등)

  • 백엔드 및 데이터베이스 (BaaS):

    • Supabase: PostgreSQL 기반 관계형 DB, Auth(인증), Row Level Security (RLS)

  • 인프라 및 배포 (Deployment):

    • Vercel (Github 연동 자동 CI/CD 배포)

    • 버전 관리: Git / Github

3.2 핵심적인 기술 및 구현 방법

  • Server-Side Rendering (SSR) 활용: Next.js의 App Router 아키텍처와 서버 컴포넌트(Server Components)를 활용하여 초기 로딩 속도 최적화 및 검색엔진/보안 이점 확보. 데이터 Fetching은 주로 서버 사이드에서 진행하여 클라이언트 연산 부하를 최소화함.

  • Supabase SSR 인증: 쿠키 기반 세션을 통해 서버 컴포넌트와 Middleware 단에서 안전하게 유저를 인증하고 페이지 접근 권한을 제어함.

  • 다중 업데이트 트랜잭션 로직 (Optimistic UI & Batching): 스캐너 폼에서 여러 개의 바코드를 1초 내에 스캔할 경우, React State에 큐(Queue)로 쌓아두었다가 2초간 입력이 없으면 비동기로 한 번에 DB에 일괄 전송(Batch Submit)하여 서버 요청 비용을 줄이고 현장 작업 속도를 극대화함.

  • 워터폴(Waterfall) 결제 할당 알고리즘: A/R Ledger에서 일괄 결제(Bulk Payment) 시, 병원이 납부한 큰 금액을 가장 오래된 미수금 인보이스부터 순차적으로 차감하며, 남은 초과 금액은 자동으로 Credit으로 전환되도록 프론트엔드 상태와 DB 트랜잭션을 일치시키는 알고리즘 구현.

향후 진행 방향 (V2 고도화)

현재 Github의 main 브랜치에서 이어질 V2 개발의 핵심 과제입니다.

  1. Multi-Tenant 완벽 격리 (Supabase RLS 고도화):

    • 현재 데모 구조에서 실제 SaaS 구조로 넘어가기 위해 모든 테이블에 lab_id를 적용하고 강력한 Row Level Security를 설정.

  2. 리메이크(Remake) 추적 시스템 개발:

    • 오리지널 케이스 연결, 과실 주체(Internal/External) 분류, 할인율 자동 적용 및 품질 관리 통계 대시보드 구축.

  3. 치과 병원(Clinic) 포털 오픈 및 AWS S3 연동:

    • 대용량 3D 스캔 파일과 랩 슬립(Lab Slip) 보관을 위한 클라우드 스토리지 연동 및 보안 강화.

추천 기사