Personal Project · 2025–2026
신혼부부를 위한
프라이빗 라이프
매니지먼트 앱
사진 갤러리·가계부·재테크·신혼 커뮤니티를 하나로 묶은 커플 전용 서비스. 초대 코드 기반 1:1 페어링, AI 자동 분류·분석, 자연어 입력을 Next.js 15 + Firebase로 구현하고 Expo로 네이티브 앱까지 출시했습니다.
Tech Stack
Next.js 15React 19TypeScriptTailwindCSS v4FirebaseFirestoreReact NativeExpo · EASshadcn/uiJotaiTanStack QueryPlaywrightTurborepopnpm
모노레포 구조
Turborepo + pnpm workspace로 웹·모바일·UI 패키지·도메인 로직 분리
웹 + 네이티브 모바일
Next.js 웹앱을 Expo WebView로 감싸 EAS로 안드로이드 앱 출시
실시간 동기화
Firestore 실시간 리스너로 커플 간 즉시 반영
AI 파이프라인
영수증 OCR + 자연어 파싱 + 지출 패턴 분석 자동화
9:41
사진 갤러리
우리 둘만의 앨범, 체계적으로
클라우드에 흩어진 사진을 하나의 공간으로. AI 자동 태깅과 폴더·태그 구조로 수백 장의 사진도 쉽게 탐색합니다.
- 폴더·태그 기반 계층 구조 — Firestore 컬렉션 설계
- AI 이미지 분석으로 장소·상황 자동 태깅
- 업로더 식별 뱃지 (나 / 파트너) 실시간 표시
- 폴더·태그 단위 슬라이드쇼 재생 모드
가계부
영수증 한 장으로 끝나는 기록
직접 입력 없이 영수증 사진 한 장으로 금액·항목이 자동 인식됩니다. 자연어로 여러 건을 한 번에 등록할 수도 있어요.
- 영수증 OCR — 촬영 즉시 금액·카테고리 자동 인식
- 자연어 파싱 — "점심 9천원, 어제 택시 15000원" 일괄 등록
- AI 소비 패턴 분석 + 커플 맞춤 절약 조언
- 수입 / 지출 / 투자 / 플렉스 4-카테고리 월별 통계
현금흐름
월급날 잔액까지 미리 예측
고정 수입·지출을 반영해 통장 잔액 흐름을 달력으로 시뮬레이션. 다가올 월급날과 카드값 시점의 잔액을 미리 보여줍니다.
- 반복 수입·지출 규칙 기반 잔액 프로젝션
- 월급날·결제일 단위 예상 잔액 캘린더
- 지출이 몰리는 날을 사전에 경고
- dayjs 기반 날짜 연산 — date-fns 미사용
재테크
개인 + 커플 자산을 한눈에
우리집(공동)과 재테크(개인 소유)를 분리한 소유 모델. 예적금·투자·환테크를 모아 개인 자산과 커플 합산 배분을 함께 봅니다.
- 개인 소유 + 커플 합산 이중 집계 모델
- 자산 종류별 배분 비율 시각화
- 환테크(외화) 자산 통합 관리
- 우리집 / 재테크 공간 분리 (소유권 격리)
커뮤니티
커플을 넘어, 신혼부부끼리
UANDI의 첫 전역(비커플) 공간. 유저 글과 외부 정보 큐레이션을 함께 다루며, 메타데이터 + 링크아웃으로 법적 가드레일을 둔 설계입니다.
- 커플 격리 밖 첫 전역 Firestore 컬렉션
- 유저 작성 글 + 외부 콘텐츠 큐레이션 혼합
- 저작권 가드레일 — 메타데이터만 저장 + 링크아웃
- 주제별 탐색 / 공감 인터랙션
Key Decisions
01
커플 단위 데이터 격리
Firebase UID 기반이 아닌 커플 코드 단위로 Firestore 컬렉션을 설계해 완전한 데이터 프라이버시를 구현했습니다.
02
자연어 파싱 파이프라인
LLM을 활용해 비정형 텍스트에서 금액·날짜·카테고리를 추출하고 복수 건을 트랜잭션으로 일괄 저장합니다.
03
모노레포 패키지 분리
UI 컴포넌트(shadcn 기반)와 가계부 도메인 로직을 독립 패키지로 분리해 재사용성과 테스트 용이성을 높였습니다.
04
모바일 퍼스트 UX
448px 고정 컨텐츠 폭, 하단 탭 네비게이션, 바텀시트 패턴으로 네이티브 앱에 준하는 모바일 경험을 웹으로 구현했습니다.
05
두 공간 소유 모델 분리
우리집(공동 소유)과 재테크(개인 소유 + 커플 합산)를 별도 소유권 모델로 분리해, 같은 커플 안에서도 자산 가시성을 제어합니다.
06
커뮤니티 전역 컬렉션
커플 격리를 벗어난 첫 전역 데이터. 외부 콘텐츠는 메타데이터만 저장하고 링크아웃하는 저작권 가드레일을 설계했습니다.
07
웹 ↔ 네이티브 브리지
Expo WebView가 window.__UANDI_NATIVE__로 데이터를 주입하면 웹이 인증 컨텍스트에서 처리 — 단일 웹 코드베이스로 네이티브 기능을 노출합니다.
08
오리지널 마스코트 시스템
브랜드 마스코트(기니피그 커플)를 직접 디자인하고, 배경 제거 파이프라인으로 로더·상태·스티커 자산 체계를 구축했습니다.
Brand Mascot
직접 디자인한 브랜드 마스코트
코랄·세이지 스카프를 두른 기니피그 커플을 오리지널로 디자인했습니다. 생성형 이미지의 가짜 체커보드 배경을 flood-fill 파이프라인으로 제거해, 로딩 인디케이터·빈 화면·에러 등 상태별 일러스트와 표정 스티커를 하나의 자산 체계로 운용합니다.
