rougether-mobile
루틴·습관 트래커 + 방 꾸미기 게임 Rougether 의 모바일 앱.
루틴을 지키면 재화를 얻고, 그 재화로 자기 방을 꾸밉니다. 친구·가족과 "집"을 만들어 서로의
루틴을 응원하는 소셜 레이어가 위에 얹혀 있습니다. iOS App Store 출시 중이며 Android는
Google Play 비공개 테스트 단계입니다.
Expo SDK 55 · React Native 0.83 · React 19 ·
Expo Router(파일 기반 라우팅) · TypeScript(strict).
시작하기
npm install
npm start # Expo dev 서버 — i / a / w 로 iOS / Android / web
개발 빌드는 실서버를 봅니다. 목 서버(MSW)는 제거됐습니다 — 웹으로 화면을 확인하면
그건 실데이터입니다. 접속 주소는 src/config/shared-endpoints.json.
구조
컴포넌트 갤러리 — Dev 탭(/dev 라우트)이 src/dev/registry/에
등록된 컴포넌트를 격리 상태로 렌더합니다. 새 컴포넌트를 만들면 여기 등록하세요.
디자인 Storybook
실제 앱 컴포넌트를 웹에서 보고, Controls로 props를 바꾸며 테마 5종·라이트/다크·글꼴 5종을
비교할 수 있습니다. 폰트는 저장소의 앱 에셋을 사용합니다.
npm ci
npx --no-install storybook dev -p 6006 --host 127.0.0.1 --no-open
로컬 Storybook을 엽니다. 정적 빌드는 아래 명령으로 생성합니다.
npx --no-install storybook build --output-dir web-build/storybook
결과물은 web-build/storybook/에 생성됩니다. 스토리 작성법과 검증 기준은
Storybook 가이드를 참고하세요. 실제 기기의 햅틱·네이티브 제스처는 기존
Dev 갤러리에서 확인합니다.
스크립트
| 명령 | 하는 일 |
|---|
npm start | Expo dev 서버 |
npm run ios / android / web | 플랫폼별 실행 |
npm run typecheck | tsc --noEmit |
npm run lint | expo lint |
npm run format / format:check | Prettier write / check |
npm test / test:watch | Jest (jest-expo + React Native Testing Library) |
node scripts/run-date-boundary.js | spec 날짜 경계 fixture로 실제 요청 생성 검증(단말 시간대 매트릭스) — .expo/date-boundary/에 기록. npm script로 두면 지문이 바뀐다 |
npm run gen:api-types | 스웨거에서 API 타입 생성 |
npm run build:characters | 캐릭터 스프라이트 시트 빌드 |
커밋 전에 typecheck · lint · format:check · test 네 가지를 통과시키세요.
ci.yml이 모든 PR에서 네 가지 검사와 Storybook 정적 빌드를 실행합니다.
배포
기본 브랜치는 dev 입니다. 기능은 feat/<기능> 브랜치에서 dev로 PR(squash 머지),
릴리스는 dev → main 승격 PR(merge commit)로 갑니다.
dev 머지는 eas-deploy를 트리거해 네이티브 지문을
비교합니다 — JS만 바뀌었으면 preview 채널 OTA, 네이티브가 바뀌었으면 EAS 빌드.
main 승격은 아무것도 발행하지 않습니다 — production OTA는 eas-release 워크플로를
main에서 수동 실행할 때만 나갑니다.
기여
AGENTS.md에 코딩 규칙·브랜치 전략·배포 절차·이슈 관리가 전부 있습니다.
코드를 건드리기 전에 읽어주세요. 특히:
- 색은
useTokens(), 크기는 Spacing/Radius, 텍스트는 useTypography() — hex·매직 넘버 금지
fontWeight를 스타일에 직접 쓰지 마세요 (커스텀 폰트가 weight별 파일이라 가짜 볼드가 납니다).
굵기는 useFontEmphasis()로 — font-hygiene.test.ts가 강제합니다- UI 문구는 한국어, 코드·주석·식별자는 영어
- 파일명 kebab-case, 컴포넌트 PascalCase named export
라이선스
MIT — LICENSE
