🧩 VIVITRIP 프로젝트 트러블슈팅 & 회고 모음

React 기반 체험 예약 플랫폼 프로젝트 VIVITRIP을 진행하며 겪은 핵심 트러블슈팅과 구조 설계 회고를 정리한 모음입니다.
각 주제는 기술적 고민과 해결 과정 중심으로 나눠졌으며, 자세한 내용은 아래 포스트에서 확인할 수 있습니다.

---

1️⃣ 체험 등록/수정 페이지 트러블슈팅

• useForm, useFieldArray를 활용한 다중 일정 동적 폼 처리
• 수정/등록 모드 분기 (reset, defaultValues) 방식 구조화
• 이미지 업로드, 시간 겹침 방지 로직 구현

👉 VIVITRIP1 - 체험 등록/수정 페이지 회고

---

2️⃣ 무한 스크롤 구현 & 트리거 방식 비교

• useInfiniteQuery 기반 무한 스크롤 구현
• useInView와 useIntersectionObserver 커스텀 훅 두 가지 방식 비교
• 성능 최적화와 UX 흐름을 고려한 트리거 전략 회고

👉 VIVITRIP2 - 무한스크롤 구조 설계와 비교

---

3️⃣ Button 컴포넌트 상태 분기 최적화

• color, size, disabled 등 복잡한 조건 분기를 객체로 분리
• twMerge, clsx 조합을 통해 Tailwind 클래스 충돌 해결
• 재사용성과 가독성을 높이는 스타일 설계 방법 적용

👉 VIVITRIP3 - 버튼 컴포넌트 트러블슈팅

---

📝 총정리

• 반복되는 컴포넌트와 패턴을 분리하고, 조건에 따라 유연하게 대응하는 구조를 설계했습니다.
• 상태 관리 및 뷰 트리거 처리에서 얻은 경험을 통해 재사용성과 유지보수성 향상에 대한 인사이트를 얻게 되었습니다.