🚇 나모타? 이거타!

기후동행카드 이용 가능 구간을 고려한 맞춤형 지하철 경로 안내 및 실시간 열차 위치 조회 서비스

📖 프로젝트 소개

기존 길찾기 서비스는 출발역과 도착역만 기준으로 경로를 안내해, 기후동행카드처럼 특정 노선에서 사용할 수 없는 교통카드를 사용하는 경우에도 동일한 경로를 추천하는 문제가 있었습니다.

실제로 기후동행카드를 사용하던 팀원이 신분당선을 이용하려 했다가, 해당 노선에서는 카드를 사용할 수 없다는 사실을 현장에서 알게 되어 다시 경로를 찾아 이동했던 경험이 있었습니다. 이처럼 교통카드 사용 여부를 고려하지 않는 기존 서비스의 불편함을 해결하고자 프로젝트를 시작했습니다.

또한 실시간 열차 위치를 확인하려면 별도의 서비스를 이용해야 하는 번거로움도 있었습니다.

나모타? 이거타! 는 기후동행카드 이용 가능 구간을 고려한 맞춤형 경로 추천과 실시간 열차 위치 조회를 하나의 서비스에서 제공하는 웹 애플리케이션입니다.

---

✨ 주요 기능

🚉 맞춤 지하철 경로 추천

일반 경로 추천 모드

기후동행카드 경로 추천 모드

출발역 설정(역 자동 완성)

도착역 설정(역 클릭)

맞춤 경로 추천

추가 정보 제공

• 출발역 · 도착역 기반 경로 조회
• 기후동행카드 적용 여부를 고려한 경로 추천
• 급행 여부
• 상·하행 방향
• 빠른 환승 위치
• 하차 문 위치 안내

---

⭐ 즐겨찾기 및 캘린더

해당 경로 클릭 시 자동 재검색

즐겨찾기에서 재검색된 경로

캘린더 추가

날짜별로 저장된 경로 보기

• 자주 이용하는 경로 즐겨찾기
• 즐겨찾기 클릭 시 자동 재검색
• 캘린더에 경로 저장
• 날짜별 저장된 경로 조회(미리 찾아서 등록 가능)

---

🚆 실시간 열차 위치

실시간 위치(상/하행 구분, 분기 구분)

• 서울교통공사 API 기반 실시간 열차 위치 조회
• 현재 운행 중인 열차 위치 확인

---

👤 회원 기능

로그인

회원가입

• 회원가입
• 로그인
• 아이디 찾기
• 비밀번호 재설정
• 프로필 사진 변경
• 비밀번호 변경
• 회원 탈퇴

---

📱 반응형 UI

모바일

데스크탑

• 모바일 · 태블릿 · 데스크탑 대응
• 화면 크기에 따른 레이아웃 변경
• 다양한 해상도에서 동일한 사용자 경험 제공

---

🧭 사용자 흐름

회원가입 및 로그인
      ↓
출발역 · 도착역 입력
      ↓
기후동행카드 적용 여부 선택
      ↓
맞춤 경로 추천
      ↓
급행 여부 · 환승 위치 · 하차 문 정보 확인
      ↓
즐겨찾기 또는 캘린더 저장
      ↓
실시간 열차 위치 확인

---

🛠 Tech Stack

Frontend

• React
• JavaScript
• Styled-components
• Recoil
• Axios

Backend

• Spring Boot
• Java
• Gradle
• JWT

Database

• MySQL