떠날 준비, 지금 바로, RoamReady – 즉흥의 설렘을 예약하세요.
롬레디 (RoamReady) 는 Roam과 Ready의 결합어로, 언제든지 떠날 준비가 된 여행자와 체험가를 위한 액티비티 예약 플랫폼입니다.
즉흥적인 여행, 자유로운 탐험, 감각적인 경험을 추구하는 당신을 위해 감성적이면서도 실용적인 디자인, 빠르고 유연한 예약 흐름, 그리고 글로벌 확장을 고려한 구조로 설계했습니다.
Next.js와 TypeScript 기반의 안정적인 기술 스택 위에 BFF 아키텍처를 도입해 사용자 경험과 보안을 강화하였으며, Zustand를 통한 상태 관리, ky와 TanStack Query를 활용한 API 요청 및 캐싱으로 깔끔하고 효율적인 사용자 경험을 제공합니다.
Preview (GIF)
|
|
|
|
|
| R&R | 유용민 | 송시은 | 김서연 | 박재현 |
|---|---|---|---|---|
| 페이지 | - 체험 등록 페이지 - 체험 수정 페이지 - 예약 현황 페이지 |
- 로그인 페이지 - 회원가입 페이지 - 404페이지 |
- 체험 상세 페이지 | - 메인페이지 - 마이페이지 |
| 공통 컴포넌트, 공통 로직 |
- Button - SelectBox - Tabs |
- Input - Toast - OAuth - 인증시스템 - 에러처리시스템 |
- Dropdown - Pagination - Header - Footer |
- BottomSheet - Modal - Profile |
| 프로젝트 설정 | - 배포 | - ESLint, Pretter 설정 - Lefthook 설정 |
||
| 데모 | - 발표 | - README | - 영상, gif | - PPT |
| 기술 | 버전 / 도구 | 설명 |
|---|---|---|
| TypeScript | TypeScript 5 | 정적 타입으로 코드 안정성과 자동완성 향상 |
| React | React 19.0.0 | 최신 기능 활용한 UI 구성 |
| Next.js | Next.js 15 (App Router) | 파일 기반 라우팅과 SSR, SEO에 강함 |
| 기술 | 버전 | 설명 |
|---|---|---|
| Node.js | 22.17.0 (LTS) | 안정적인 런타임 환경 |
| pnpm | 10.x | 빠른 설치 속도와 모듈 중복 최소화 |
| 기술 | 설명 |
|---|---|
| Tailwind CSS 4 | 빠르고 일관된 UI 구성 |
| 기술 | 설명 |
|---|---|
| Ky | Axios 대비 번들 사이즈가 작은 fetch 기반 HTTP 클라이언트 |
| Zustand | 간단한 전역 상태 관리 |
| TanStack Query | 서버 상태와 캐싱을 효율적으로 관리 |
| 기술 | 설명 |
|---|---|
| ESLint / Prettier | 코드 스타일 및 문법 일관성 유지 |
| CommitLint | 커밋 메시지 규칙을 통한 협업 품질 향상 |
| lefthook | Git Hook 기반 자동화로 코드 품질 유지 |
| Zod + React Hook Form | 타입 안전한 Form 유효성 검사 |
| GitHub Actions + Vercel | PR 시 미리보기 배포 링크 자동 생성 및 댓글로 공유하는 자동화된 테스트 및 배포 환경 |
▶ 더 많은 트러블 슈팅을 보고싶다면 이곳을 클릭해 확인하세요.
▶ 더 많은 UX에 대한 고민을 보고 싶다면 이곳을 클릭해 확인하세요.
| 제목 | 작성자 |
|---|---|
| 클라이언트 측 비밀번호 확인 로직 도입 (Zod refine 활용) | 송시은 |
| 상세 페이지 이미지 클릭시 이미지 모달 기능 | 김서연 |
| 로그인/회원가입 UX 개선 (입력값 자동 유지 및 세션 일관성 확보) | 송시은 |
| 알림 주기적 반영 | 김서연 |
| Streaming SSR로 사용자 경험과 SEO 개선하기 | 박재현 |
▶ 더 많은 설계 및 구현 문서를 보고싶다면 이곳을 클릭해 확인하세요.
| 주제 | 작성자 |
|---|---|
| API 요청 및 인증 아키텍처 가이드 | 송시은 |
| Slot 패턴과 해당 패턴 사용을 위한 cloneElement | 유용민 |
| 체험 상세 페이지 캐싱 전략 | 김서연 |
| URL Query 기반의 필터, 정렬, 페이지네이션 구현하기 | 박재현 |
▶ 더 많은 TIL을 보고 싶다면 이곳을 클릭해 확인하세요.
| 제목 | 작성자 |
|---|---|
| requestAnimationFrame() | 김서연 |
| 리액트의 SetStateAction과 Dispatch 타입 | 박재현 |
| Tailwind v4 @theme · @utility · @layer utilities | 송시은 |
애자일 + 워터폴의 장점을 섞은 협업 방식을 기반으로 코드 품질과 작업 효율을 높였습니다.
다양한 커뮤니케이션과 GitHub Projects를 적극 활용하며 이슈 기반으로 작업을 관리했습니다.
또한, 정기적인 커뮤니케이션을 통해 팀 작업의 가시성과 협업 효율성을 높였습니다.
- 칸반보드 – 작업 흐름을 실시간으로 트래킹
- 로드맵 – 주요 기능과 일정 관리
- PR 리뷰(+코드래빗) – 코드 품질 개선을 위한 상호 리뷰
- 데일리 스크럼 – 매일 진행 상황 공유 및 협의
- 디스커션 – 설계, 트러블슈팅, 회고 등 다양한 논의