여행의 이유 : 나만의 여행 방식과 코스 공유 커뮤니티
자신만의 여행 코스와 숨겨진 추천 명소를 공유하고, 취향에 맞는 여행 스타일을 공유할 수 있는 웹 기반 커뮤니티 플랫폼입니다.
플랫폼 · 웹담당 역할 · 프론트엔드
작성자 김준하
작성일수정일
프로젝트 개요
- 구분: 대규모 팀 프로젝트 (프론트엔드 담당)
- 기간: 2024.01 ~ 2024.02
- 기여도: 프론트엔드 개발 기여도 20% (전체 11명 대규모 구성: 프론트엔드 5명, 백엔드 4명, 기획 1명, 디자인 1명)
- 기술 스택: React, JavaScript, Styled-components, MSW(Mock Service Worker), zustand, TanStack Query
담당 기능
- 로그인 페이지 제작 (+소셜 로그인)
- 마이페이지 제작
개발 기록
1. 검색·추천 커뮤니티의 기본 흐름 구현
여행 코스와 숨겨진 명소를 공유하는 서비스의 핵심 흐름을 먼저 완성하는 데 집중했습니다. 로그인과 소셜 로그인으로 사용자를 식별하고, 마이페이지에서 사용자가 작성한 여행 콘텐츠와 개인 정보를 확인할 수 있도록 화면을 구성했습니다.
2. 서버 상태와 화면 상태 분리
MSW로 백엔드 API 응답을 모킹해 실제 API가 준비되기 전에도 로딩·성공·실패 상태를 확인했습니다. TanStack Query는 서버 데이터 요청과 캐시를 담당하고, Zustand는 화면에서 필요한 클라이언트 상태를 담당하도록 나누어 컴포넌트가 API 구현 세부사항에 직접 의존하지 않게 했습니다.
대규모 팀 프로젝트에서 프론트엔드 담당 범위를 명확히 나누고, Styled-components로 화면 스타일을 공통화해 여러 화면의 수정 범위를 줄였습니다.