내집마련 청약·대출·세금·규제를 한 번에 — 토스 미니앱(앱인토스)으로 만든 종합 부동산 도우미
흩어져 있던 청약 자격·가점, 부동산 규제, 대출/세금/부대비용 계산, 자금 플래닝을 토스 안에서 한 흐름으로 끝내는 비게임 도구 앱입니다. 모든 계산은 클라이언트 순수함수로 동작하고, 청약 공고 자동 알림은 청약홈 공공데이터 OpenAPI → Supabase → 토스 푸시 파이프라인으로 설계했습니다.
| 홈(준비도) | 계산기 | 청약 |
|---|---|---|
 |
 |
 |
| 자금 플랜 | 더보기 | 규제 진단 |
|---|---|---|
 |
 |
 |
- 청약 자격 셀프체크 & 가점 계산 — 1순위 가능 여부와 84점 만점 가점(무주택기간·부양가족·통장기간)을 항목별로 분해
- 내 상황 규제 진단 — 지역(규제유형)·주택수·소득을 입력하면 적용되는 대출·세금·청약/매매 규제만 골라 안내하는 룰 엔진(16개 규칙)
- 대출 계산기 — 중도금(회차별 이자), 주택담보대출(원리금균등/원금균등/만기, 분할상환표), DSR·LTV 한도 역산(스트레스 DSR), 정책대출 비교
- 부대비용·세금 계산기 — 취득세(중과/생애최초 감면), 중개보수(복비), 등기비용, 총 내집마련 비용 합산
- 자금 플랜 시뮬레이터 — 계약금→중도금→잔금→부대비용을 시점별 타임라인 + 누적 현금흐름 + 실현가능성 신호등으로
- 청약 알리미 — 관심단지 청약일 D-day (+ 청약홈 OpenAPI 자동 알림은 백엔드 준비 완료)
- 내집마련 준비도 — 단계별 진행감을 주는 비게임 게이미피케이션(준비도 게이지·연속 기록)
flowchart TD
subgraph Client["📱 WebView (React + TDS)"]
Nav["탭/스택 네비게이션"]
Calc["순수함수 계산 엔진<br/>loan · cost · cheongyak · regulation · planning"]
Game["게이미피케이션<br/>준비도·연속기록 (localStorage)"]
Ads["광고 게이트<br/>보상형·전면·배너"]
end
subgraph Backend["☁️ Supabase (옵션2 자동 알림)"]
Ingest["ingest-cheongyak<br/>청약홈 OpenAPI 수집"]
Notify["match-and-notify<br/>조건 매칭 → 토스 푸시"]
DB[("notices ·<br/>alarm_subscriptions ·<br/>push_log")]
end
Gov["data.go.kr<br/>청약홈 분양정보 OpenAPI"] --> Ingest --> DB --> Notify --> Push["토스 스마트 발송"]
Calc --> Game
Client -. "키 없으면 로컬 동작<br/>(graceful degradation)" .- Backend
설계 원칙
- 계산 = 순수함수(
src/features/*/calc.ts)로 분리해 테스트·검증 용이, UI와 무관하게 정확 - 세율·규제 수치 = 데이터로 분리(
*/data.ts,*/rules.ts)에lastVerified기준일 명시 → 정책 변경 시 데이터만 교체 - Graceful degradation — 광고/Supabase 키가 없어도 브라우저·개발에서 흐름이 끊기지 않음
- 로그인 없음 — 모든 데이터는 기기 로컬(localStorage)에만 저장(익명), 별도 개인정보 미수집
| 영역 | 사용 |
|---|---|
| Front | React 18, TypeScript(strict), Vite 6, @toss/tds-mobile |
| Platform | @apps-in-toss/web-framework (WebView, 광고·공유·이벤트로그) |
| Backend | Supabase (Postgres + RLS, Edge Functions/Deno) |
| Data | 한국부동산원 청약홈 분양정보 OpenAPI (data.go.kr) |
| Tooling | ESLint, Prettier, Playwright(스모크/스크린샷) |
- 비게임 도구 — 코어 동사는 계산/진단/안내/기록. 게이미피케이션은 부가 레이어
- 사행성 0 — 베팅·추첨·뽑기 워딩 없음. 광고 보상은 결정적(광고 1회 → 정해진 상세 1개 해금)만
- 만남·연애 프레이밍 0, 투자·투기 조장 톤 배제(중립 안내)
- 참고용 고지 — 모든 계산/진단 화면에 "2026년 기준 참고용, 공식 자료 확인" 면책 명시
npm install
cp .env.example .env # 비워도 동작(광고·백엔드는 graceful 처리)
npm run dev # http://localhost:5173
npm run build # 타입/번들 + .ait 산출
npm run lint
node scripts/screenshots.mjs # 전 화면 스모크 + 스크린샷청약홈 자동 알림(옵션2) 백엔드 셋업은 supabase/README.md 참고
(data.go.kr 서비스키 → Supabase 배포 → 스케줄러 → 토스 푸시 템플릿).
src/
features/
home/ 홈 대시보드(준비도·연속기록·바로가기)
calc/ 계산기 허브
loan/ 대출 계산기 (calc.ts / data.ts)
cost/ 부대비용·세금 계산기
cheongyak/ 청약 자격·가점·알리미
regulation/ 규제 진단 룰엔진 (rules.ts / engine.ts)
planning/ 자금 플랜 타임라인
more/ 공유·안내
components/ ui 키트, 배너 광고
hooks/ useAdGate, useInterstitialAd
lib/ nav, env, analytics, storage, format, gamification, supabase, cheongyakApi
data/ share
supabase/ migrations + Edge Functions(ingest / match-and-notify)
planning/ 제품 기획 문서 8종
submission/ 심사 제출 자료(앱정보 docx · 아이콘 · 썸네일)
- MVP — 계산기 5종 + 규제 진단 + 청약 자격/가점 + 로컬 청약 알리미
- 옵션2 백엔드 — 청약홈 OpenAPI 수집 + 푸시 파이프라인(코드/스키마 완성)
- 자동 알림 라이브 — data.go.kr 서비스키·토스 푸시 템플릿 연결
- 규제/세율 원격 JSON 배포로 무중단 갱신
- 보상형 광고 안정화 후 토스포인트 전환 검토
※ 본 앱의 계산·진단 결과는 참고용입니다. 실제 청약·계약·대출·세무는 청약홈·금융사·지자체 등 공식 자료와 전문가 상담으로 확인하세요.