,쉼표1차 MVP 데모

이 데모가 무엇이고, 어떻게 만들어졌는가

고양·파주 마사지샵을 지도에서 찾고 바로 전화하는 모바일 웹의 1차 범위를 실제로 동작하게 만든 데모입니다. 개발을 처음 맡기는 분이 읽어도 알 수 있게 썼습니다. 샵 정보는 시연용으로 만든 가상의 업소입니다.

공고의 필수 과업 — 이 데모에서 동작하는 것

지도와 리스트카카오 지도에 샵을 표시하고 같은 결과를 목록으로도 봅니다. 지도에서 핀을 누르면 목록의 카드가 함께 켜집니다.
동 단위 필터고양시 3개 구와 파주시의 동·읍·면으로 거릅니다. 동마다 샵 수가 보입니다.
샵 상세상호, 사진(여러 장), 주소, 전화번호, 영업시간, 소개, 작은 지도, 카카오맵 길찾기.
전화하기목록의 전화 버튼과 상세 하단의 큰 버튼 모두 바로 전화가 걸립니다. 누른 횟수만 세어 관리자 통계에 씁니다(개인정보 없음).
비회원 열람회원가입과 로그인이 없습니다.
PWA홈 화면에 추가하면 주소창 없이 앱처럼 열리고, 한 번 본 화면과 사진은 오프라인에서도 보입니다. 앱스토어 등록은 하지 않습니다.
관리자 웹샵 등록·수정·숨김, 사진 등록과 순서, 지역(동) 설정. 주소를 검색하면 지도 좌표와 동이 자동으로 채워집니다. 관리자 열기 (시연 비밀번호는 제안서에)
모두 동일하게 노출제휴·비제휴 구분이 없고 정렬은 가나다순 또는 내 위치에서 가까운 순뿐입니다.

덧붙인 것 — 공고에는 없지만 있으면 좋은 것

+
내 주변 가까운 순위치 권한을 허용하면 거리가 표시되고 가까운 순으로 바뀝니다. "가까운 샵을 찾아 바로 전화"라는 목표에 직접 닿는 기능입니다.
+
상호·동·종류 검색샵이 80곳을 넘으면 동 필터만으로는 부족합니다.
+
전화 연결 통계관리자 첫 화면에 이번 주·이번 달 전화 연결 수와 많이 걸린 샵이 보입니다. 나중에 샵에 "이번 달 전화 N건"을 보여주는 근거가 됩니다.

2차 확장을 어떤 구조로 준비해 두었는가

1차 견적에는 들어가지 않지만, 나중에 갈아엎지 않도록 자리를 미리 잡아 두었습니다. 관리자 화면의 "2차 준비" 탭에서 실제 상태를 볼 수 있습니다.

항목1차에 잡아 둔 자리2차 작업 범위(예상)
지역 ON/OFF지역 표에 켜짐/꺼짐 열이 있고 관리자에서 동 단위로 이미 켜고 끌 수 있습니다. 시 단위 스위치는 설정 표에 자리만 있습니다.시·구 단위 스위치 화면. 서울·인천 등 새 지역은 동 목록만 추가하면 됩니다. 약 2~3일
제휴 여부샵 표에 제휴 열이 있으나 1차 화면에서는 읽지도 보여주지도 않습니다.제휴 배지, 정렬 규칙 합의, 관리자 토글. 약 2~3일
예약 요청·알림톡샵 상세의 "전화하기" 자리에 버튼 하나를 더 놓는 구조. 예약 표는 만들지 않았습니다.예약 요청 화면, 사장님 알림톡(카카오 비즈메시지 계약 필요), 관리자 예약 목록. 약 2~3주
PG 결제없음. 예약 요청 위에 얹습니다.PG 가입·심사(토스페이먼츠 등), 예약금 결제·취소·환불 흐름. 약 2~3주 + PG 심사 기간
사용자 앱화면과 데이터가 API로 완전히 분리되어 있어 앱은 같은 API를 씁니다.앱 껍데기(React Native 등)와 스토어 등록. 약 3~4주
별점·동별 탑3전화 클릭 통계가 이미 동별로 집계됩니다.리뷰 표, 별점 UI, 어뷰징 대응 규칙. 약 2주
사장님 앱·로그인샵 표에 사장님 계정 열이 있습니다(비어 있음).사장님 가입·본인 샵 수정·예약 확인. 약 2~3주

어떤 상태가 되어야 "완료"인가

1
사장님 대신 샵을 등록해 보고 10분 안에 끝난다주소 검색 → 사진 3장 → 저장 → 사용자 화면에 바로 보임. 80곳을 확보하려면 등록이 쉬워야 합니다.
2
휴대폰에서 지도 → 상세 → 전화가 3번 터치 안에 된다공고에서 말한 "막힘없이 돌아가는 흐름"의 기준입니다.
3
홈 화면에 추가된 아이콘으로 열린다안드로이드 설치 배너와 아이폰 안내가 모두 동작해야 합니다.
4
소스코드·서버·도메인이 발주자 명의로 옮겨져 있다잔금 전 이전 조건을 그대로 완료 기준에 넣습니다.
5
운영 매뉴얼대로 발주자가 혼자 샵을 등록·숨김·사진 교체할 수 있다

어떻게 만들어졌는가 (비개발자용)

화면

  • 표준 웹(HTML·CSS·JavaScript). 앱 설치 없이 휴대폰 브라우저에서 열리고, 홈 화면 추가(PWA)로 앱처럼 씁니다.
  • 지도는 카카오 지도. 주소 검색은 카카오 우편번호 서비스(무료).

서버·데이터

  • Cloudflare Pages Functions + D1 데이터베이스 + R2 사진 저장소. 서버 컴퓨터를 켜 두지 않고 요청이 온 만큼만 과금됩니다.
  • 1차 규모(샵 수백 곳, 하루 수천 방문)에서 월 운영비는 유료 요금제 약 7,000원 + 도메인 정도입니다.

2차에 바뀌는 것

  • 예약·결제가 붙으면 알림톡 발송비와 PG 수수료가 별도로 생깁니다.
  • 화면과 데이터가 분리돼 있어 앱을 만들 때 서버를 다시 만들지 않습니다.