chpark f78949c21a
Build & Deploy / build-and-deploy (push) Failing after 9s
feat: 실제 동작하는 백엔드 + DB + 카카오 로그인
Backend (server/):
- Fastify + Prisma + PostgreSQL 16
- JWT 인증 (bcrypt) + 카카오 OAuth (/auth/kakao — kapi.kakao.com 호출)
- REST API: auth, users, family, policies, claims, score, notifications, diagnosis, consults
- 실제 보험점수 알고리즘 (카테고리별 가중치·최소보장 기반)
- Multipart 업로드 (영수증/진단서 → 디스크 persistence)
- Swagger UI /docs

Client:
- api/client.ts + api/endpoints.ts (fetch 래퍼 + AsyncStorage 토큰)
- 인증 스토어 (hydrate/login/register/kakao/logout)
- 로그인/회원가입 화면 + 카카오 버튼
- 홈/내보험/가족/점수/청구 API 연동 (pull-to-refresh)
- 보험 추가 모달 + 가족 구성원 추가 모달
- 로그인 전/후 스택 분기 (RootNavigator)

Infra:
- docker-compose.yml (로컬 Postgres+API)
- server/Dockerfile (Prisma migrate deploy + node)
- deploy/k8s/postgres.yaml (StatefulSet + 10Gi PVC)
- deploy/k8s/api.yaml (Deployment + Ingress api.insurance.junggomoa.com)
- CI workflow 확장 (web + api 동시 빌드·배포)
- POSTGRES_PASSWORD / JWT_SECRET Gitea Secrets 추가 필요
- 반응형 웹 레이아웃 (max-width 480px 폰 프레임)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-23 00:32:44 +09:00

보험케어 (Insurance Care)

시그널플래너 / 보맵 벤치마크 기반 보험 관리 앱. React Native + ExpoAndroid · iOS · Web 모두 지원합니다.

🚀 실행 방법

1. 의존성 설치

npm install

2. 앱 실행

npm start       # Expo Dev Tools 실행 (QR 코드로 실기기 연결)
npm run android # Android 에뮬레이터 또는 연결된 기기
npm run ios     # iOS 시뮬레이터 (macOS 필요)
npm run web     # 브라우저에서 미리보기 (디자인 확인용)

개발 중 UI 빠르게 확인할 때는 npm run web이 가장 편합니다. 실기기는 Expo Go 앱 설치 후 QR 스캔.

📱 주요 구성

하단 탭 (시그널플래너/보맵 스타일)

설명
보험 점수, 숨은보험금, 주요 기능 바로가기
내 보험 가입된 보험 목록·월 납입·총 보장
보험금 청구·AI 판정·숨은보험금·체크리스트
상담 카카오/전화/방문 상담, 추천 설계사
마이 내 정보, 설정, 고객센터

구현된 14개 핵심 기능

# 기능 라우트
1 3초 보험 진단 (단계형 설문) Diagnosis
2 연령별 분석 (차트 + 추천) Analysis
3 내 보험 점수 (원형 게이지) Score
4 전문가 상담 (카카오/전화/방문) Consult
5 숨은보험금 조회 (로딩→결과) HiddenMoney
6 질병코드 조회 (검색 + DB) DiseaseCode
7 보험금 청구 (카메라/갤러리) Claim
8 건강검진 결과 분석 HealthCheck
9 우리 가족 보험 한눈에 Family
10 병원 가기 전 체크리스트 HospitalChecklist
11 AI 보험금 판정 (챗봇형) AIJudge
12 보험료 다이어트 진단 PremiumDiet
13 실손 세대 자동 판별 SilsonGen
14 만기·갱신 알림 (알림톡 설정) Notifications

🧩 기술 스택

  • React Native 0.74 + Expo 51
  • TypeScript
  • React Navigation 6 (Native Stack + Bottom Tabs)
  • Zustand — 전역 상태 (프로필/가족/보험 데이터)
  • expo-linear-gradient, react-native-svg — 그라데이션/점수 게이지
  • react-native-chart-kit — 연령별 보험료 막대 차트
  • expo-image-picker — 영수증 카메라/갤러리 (보험금 청구)
  • @expo/vector-icons — Ionicons

📂 폴더 구조

src/
├── components/        # 공용 UI (Card, Button, Header, Badge, ScoreGauge 등)
├── data/              # 질병 코드 DB, 실손 세대 테이블 (목업)
├── navigation/        # RootNavigator, BottomTabs
├── screens/           # 화면 19개 (하단 탭 5 + 스택 14)
├── store/             # Zustand 전역 스토어
└── theme/             # colors, typography, spacing, radius, shadow

🎨 디자인 시스템

  • Primary: #3B82F6 (파란 계열 / 보험 앱 관례)
  • Success: #10B981 / Warning: #F59E0B / Danger: #EF4444
  • 폰트: 시스템 폰트 (SF Pro / Roboto / 나눔고딕)
  • 라운드 14px, 그림자 3단계, Pill/Badge/Progress 컴포넌트 제공

📝 TODO (다음 단계)

  • 실제 보험사 OpenAPI 연동 (현재 목업 데이터)
  • 카카오 알림톡 발송 백엔드 (Solapi/Kakao Business API)
  • 푸시 알림 스케줄링 (expo-notifications)
  • 사용자 인증 (소셜 로그인 — 카카오/네이버/애플)
  • 보험 증권 OCR (네이버 Clova / Google Vision)
  • AI 판정 기능 실제 LLM 연동 (Claude API)
  • 앱스토어/플레이스토어 배포 (EAS Build)

💡 웹에서도 확인되나요?

네. npm run web 실행 시 모든 화면을 브라우저에서 볼 수 있습니다. 단, 카메라(보험금 청구)/푸시알림 같은 네이티브 기능은 실기기/에뮬레이터에서 확인해야 합니다.

S
Description
No description provided
Readme 547 KiB
Languages
TypeScript 96.8%
Shell 1.9%
JavaScript 0.7%
Dockerfile 0.6%