Mongle

내가 만난 사람과 함께한 순간을 사람 중심으로 기록하고, 관계의 흐름을 다시 꺼내보는 개인 관계 기록 서비스입니다.

연락처처럼 사람의 고정 정보만 저장하지 않습니다. 관계 지도, 사람별 프로필과 타임라인, 감정과 사진이 담긴 기록, 1년 전 오늘의 회고를 한곳에 모읍니다.

주요 화면

시작하기	프로필 설정	관계 지도
몽글라인	사람	기록 작성

현재 제공하는 기능

• 이름과 프로필 이미지로 시작하는 2단계 온보딩
• 나를 중심으로 사람과 관계 태그를 보여주는 관계 지도
• 전체 기록의 시간순 피드와 사람별 활동 흐름 시각화
• 사람 검색·정렬·즐겨찾기, 프로필 등록·수정, 사람별 타임라인
• 함께한 사람, 감정, 내용, 날짜·시간, 날씨, 사진을 나눠 입력하는 기록 작성
• 기록 상세 조회·수정과 1년 전 오늘 회고
• 홈 기본 기간, 개인 태그, 다크 모드 설정
• 모바일 브라우저·PWA의 Stackflow 내비게이션과 모바일 앱의 RN 멀티 WebView 스택

저장소 구성

경로	구성	설명
frontend/	React 19, Vite, Stackflow, TanStack Query	모바일 우선 웹·PWA
app/	Expo Router, React Native WebView	RN 스택 기반 모바일 앱
backend/	Kotlin, Spring Boot, JPA	인증, 사람, 기록, 타임라인, 칩 API
docs/prd/	Markdown	화면별 제품 요구사항
backend/docs/	Markdown	mustpass와 로컬·배포·운영 절차

로컬 실행

준비물

도구	버전
Node.js	frontend 20.19+ 또는 22.12+, app 22.13+
pnpm	10+
Docker	Compose v2 포함

1. 백엔드

cd backend
docker compose up -d --build

로컬 Docker 백엔드는 http://localhost:18080에서 실행됩니다.

curl http://localhost:18080/actuator/health
# {"status":"UP"}

Docker 없이 JDK 21과 H2를 사용할 수도 있습니다.

cd backend
./gradlew bootRun
# http://localhost:8080

2. 프런트엔드

cd frontend
pnpm install
pnpm dev:vite
# http://localhost:3000

pnpm dev:vite는 /api를 기본 Docker 백엔드인 localhost:18080으로 프록시합니다. bootRun에 연결하려면 다음과 같이 실행합니다.

BACKEND_URL=http://localhost:8080 pnpm dev:vite

사진 업로드까지 확인하려면 Vercel 프로젝트와 Blob 환경변수가 필요합니다. 설정 방법은 프런트엔드 README에 있습니다.

3. 모바일 앱

프런트엔드를 실행한 상태에서 별도 터미널을 사용합니다.

cd app
cp .env.example .env.local
pnpm install
pnpm ios
# 또는 pnpm android

Android 에뮬레이터와 실기기의 WebView 주소 설정은 앱 README를 참고합니다.

문서

문서	내용
프런트엔드 README	실행 모드, 구조, API 생성, 검증
앱 README	Expo 앱 실행과 WebView 주소 설정
백엔드 README	API와 화면별 엔드포인트
로컬 백엔드 Runbook	Docker·H2 실행과 데이터 리셋
제품 PRD	제품 범위와 화면별 기준