Meridian Dental

치과 의원에서 즉시 도입할 수 있는 패키지형 제품으로 기획된 1인 치과용 마케팅 사이트, 환자 포털, AI 예약 어시스턴트 및 관리자 콘솔.

역할: Solo full-stack design and development일정: 2026유형: Productised web app

Next.js 16

React 19

Tailwind CSS 4

shadcn/ui

Supabase

Resend

Gemini AI

FullCalendar

개요

Meridian Dental은 1인 치과 의원을 위한 종합 웹 인프라 및 경량 운영 콘솔입니다. 공개 웹 영역은 진료 과목, 의료진 소개, 문의, 예약 마법사를 갖춘 완성도 높은 마케팅 사이트로 구성되어 있습니다. 그 이면에는 환자 포털, 질문에 답하고 예약을 처리하는 AI 어시스턴트, 치과 측에서 모든 운영을 총괄하는 관리자 콘솔이 자리 잡고 있습니다. 일회성 외주 제작 사이트가 아닌 일회성 구축비와 월 구독 플랜으로 구성된 완성형 판매 제품으로 제작했습니다. 기존 진료 관리 시스템을 대체하려 하기보다는, 해당 시스템의 앞단에 자연스럽게 맞물려 작동하도록 의도적으로 범위를 설계했습니다.

문제점

1인 치과 의원은 대개 난처한 선택에 놓이게 됩니다. 전화번호만 달랑 적혀 있고 아무 기능도 없는 겉만 번지르르한 소개용 웹사이트를 쓰거나, 환자 기록 관리는 되지만 정작 환자의 온라인 예약이나 질문 답변에는 아무 도움도 되지 않는 무거운 진료 관리 소프트웨어에 비싼 비용을 치러야 합니다. 전문적인 디자인을 갖추고, 환자가 스스로 예약할 수 있으며, 일상적인 질문에 답해주고, 치과의사가 이 모든 것을 수억 원대 소프트웨어 계약 없이 간편하게 관리할 수 있는 '그 중간'을 제공하는 서비스는 어디에도 없었습니다.

내 역할 및 접근 방식

제품 기획부터 엔지니어링까지 전 과정을 1인 단독으로 설계하고 구축했습니다. 작업의 상당 부분은 무엇을 구축하지 않을지 결정하는 것이었습니다. 이 제품은 기존 진료 관리 시스템과의 경쟁을 의도적으로 피하고 예약, 환자 커뮤니케이션, 소규모 운영 콘솔 등 환자 접점(front door)에 집중했습니다. 이러한 원칙 덕분에 범위를 실제로 배포 가능한 수준으로 유지하고, 명확한 가격을 책정할 수 있을 만큼 가치 제안을 뚜렷하게 만들 수 있었습니다.

기술 스택

프레임워크Next.js 16 (App Router, Turbopack) with React 19

스타일링 / UITailwind CSS 4 with shadcn/ui

백엔드Supabase (Postgres, Auth, Storage)

이메일Resend with React Email templates

AIVercel AI SDK v6 with Google's Gemini 2.5 Flash

일정 관리FullCalendar v6

폼 및 유효성 검증react-hook-form with Zod

애니메이션GSAP

주요 기능

공개 마케팅 사이트홈, 진료 과목, 의료진, 오시는 길, 보험 안내, 신규 환자 안내 페이지 및 단계별 안내 예약 마법사.

환자 계정Supabase 매직 링크를 통한 비밀번호 없는 로그인.

환자 포털예약 내역 및 프로필 관리를 위한 비공개 대시보드.

AI 어시스턴트치과의 자체 비즈니스 문서를 기반으로 답변하며 도구 호출(tool calls)을 통해 실제 작업(예약 접수, 문의 메시지 전송, 적절한 진료 안내 페이지 노출 등)을 수행할 수 있는 Gemini 기반 챗봇.

관리자 콘솔리드 관리, 챗봇 지식 문서 편집, 진료 항목 및 치과의사 정보 생성·수정·삭제, 예약 현황 조회, 드래그 앤 드롭 일정 변경 캘린더 활용.

중복 예약 방지 시스템데이터베이스 레벨에서 치과의사별 중복 예약을 원천 차단하며, 예약 마법사에서 환자가 선택하기 전에 예약 불가 시간대를 회색으로 비활성화.

갤러리

샘플 의료진 선택 및 치아 미백 진료를 포함한 Meridian 예약 플로우

데모 예약 시간 및 진료 예상 비용이 표시된 Meridian 예약 캘린더

도전 과제 및 해결 방안

가장 핵심적인 엔지니어링 과제는 중복 예약 방지였습니다. 두 명의 환자가 동일한 시간대 슬롯에 동시에 "확인"을 누르는 것은 전형적인 경쟁 상태(race condition)이며, 애플리케이션 코드 레벨에서 예약 가능 여부를 확인하는 것만으로는 이 간극을 완벽히 메울 수 없습니다. 저는 Postgres에서 GiST 배타 제약 조건(exclusion constraint)을 활용하여 이를 해결함으로써, 데이터베이스 엔진 자체에서 동일 치과의사에 대한 겹치는 예약을 원자적(atomically)으로 거부하도록 구축했습니다. 이를 통해 충돌 가능성을 '낮추는' 데 그치지 않고 '원천 차단'했습니다. 또한 별도의 예약 가능 여부 엔드포인트가 예약 마법사에 데이터를 공급하여 예약 불가능한 시간대는 사전에 비활성화(회색 표시)되므로, 환자가 애초에 오류 화면을 마주하는 일 자체가 거의 없습니다.

AI 어시스턴트 역시 흥미로운 구현 과제였습니다. 의료 진료 기관용 챗봇은 잘못된 정보를 지어내서는 안 됩니다. 치과 자체 비즈니스 문서를 기반으로 응답을 그라운딩(grounding)하여 치과의사가 직접 관리하고 편집 가능한 실제 콘텐츠에서만 답변이 생성되도록 했으며, 자유 형식 대화 대신 엄격히 정의된 소수의 도구(tool call) 세트를 부여했습니다. 이 어시스턴트는 예약 접수, 문의 메시지 전송, 관련 진료 안내 페이지 안내 외에는 다른 동작을 수행할 수 없습니다. 치과의사가 관리자 콘솔에서 직접 지식 문서를 편집할 수 있어 개발자가 개입하지 않아도 어시스턴트가 항상 최신 상태를 유지합니다.

결과

Meridian Dental은 즉시 시연 가능한 작동형 제품입니다. 치과 의원은 사이트 외형을 바로 확인할 수 있고, 환자는 AI 어시스턴트나 예약 마법사를 통해 직접 예약할 수 있으며, 예약 건은 일정 충돌 방지 데이터베이스 보호와 함께 관리자 캘린더에 실시간으로 반영됩니다. 일회성 맞춤 개발이 아닌 재사용 가능한 완성형 솔루션으로 패키징되어, 포트폴리오 프로젝트이자 실질적인 상업용 템플릿으로 기능합니다.

유사한 프로덕트 문제가 있으신가요?

현재 프로덕트 현황, 필요한 결과, 직면한 제약 사항을 공유해 주세요. 이를 바탕으로 합리적인 첫 번째 마일스톤을 정의해 드립니다.

웹 애플리케이션 개발 서비스

프로젝트 브리프 시작하기

전체 프로젝트 다음 프로젝트Halatap