Feat: 추천경로 페이지 개편

[junggayeong]

어떤 기능인가요?

외국인 충북 여행자가 AI 추천 코스를 지도 기반으로 쉽게 이해하고 활용할 수 있도록 /course 화면을 지도형 AI 코스 플래너 화면으로 개편합니다.

현재 /course 화면은 추천 기능 확인용 MVP에 가까우며, 개발용 설명 카드와 카드 나열형 추천 결과 중심으로 구성되어 있습니다. 이번 작업에서는 프론트엔드가 백엔드 추천 API를 단순하게 호출하고, 추천 결과를 좌측 일정 패널과 우측 Google Map 기반 동선 화면으로 표시하도록 개선합니다.

작업 내용

• 프론트 추천 요청 구조를 POST /api/v1/recommend/routes 중심으로 정리
• 프론트에서 weatherTimeline, candidatePlaces를 직접 조립하지 않도록 제거
• activityIntensity, publicTransit, food 등 기존 입력값을 백엔드/AI 연동에 맞는 값으로 매핑
• /course 화면의 상단 개발용 설명 카드 4개 제거
• 기존 프로젝트의 디자인 톤을 유지하면서 좌측 코스 패널 + 우측 지도 구조로 화면 개편
• 추천 장소를 Google Map에 번호 마커로 표시
• 추천 장소 순서대로 polyline을 연결해 이동 동선 표시
• 여행 요약, 총 이동거리, 예상 소요시간, Day별 일정 리스트 표시
• 장소 이미지, 장소명, 카테고리, 주소, 추천 이유, 날씨 반영 이유 표시
• 플랜B 정보를 장소별 대체 코스 형태로 표시
• 추천 결과 없음, 로딩, API 실패 상태를 사용자용 UI로 정리
• 화면 코드가 커질 경우 코스 폼, 일정 패널, 지도 컴포넌트로 분리

참고 사항

• 백엔드 추천 API는 POST /api/v1/recommend/routes를 사용합니다.
• 날씨 데이터와 후보 장소 데이터 조립은 백엔드에서 처리하는 방향입니다.
• 프론트는 사용자 입력값만 전달하고, 응답받은 추천 결과를 지도와 일정 UI로 표시합니다.
• 디자인은 기존 프론트의 다른 페이지와 같은 톤을 유지합니다.
• application-secret.properties는 프론트 작업 커밋 대상에 포함하지 않습니다.