출발지부터 따릉이 대여·반납 대여소와 목적지까지 한 번에 안내하는 통합 경로 서비스
따라와잉은 따릉이를 타기 전후로 여러 지도와 앱을 오가야 하는 불편을 줄이기 위해 만든 웹 서비스입니다. 출발지와 도착지만 선택하면 가까운 출발 대여소, 자전거 이동 경로, 목적지와 가까운 반납 대여소, 처음과 마지막 도보 구간을 하나의 여정으로 연결합니다. 전체 경로가 필요하지 않을 때는 현재 위치를 기준으로 가까운 출발·반납 대여소만 빠르게 찾을 수도 있습니다.
출발지 → 도보 → 출발 대여소 → 따릉이 → 반납 대여소 → 도보 → 목적지
- 따릉이 앱에서 가까운 대여소까지 가는 도보 경로를 바로 확인하기 어렵습니다.
- 지도 앱에서 목적지까지 자전거 경로를 찾은 뒤 반납 대여소를 다시 찾아야 합니다.
- 대여소에 도착했는데 이용 가능한 따릉이가 없으면 다른 대여소를 다시 검색해야 합니다.
- 장거리 이동 중 이용권 시간을 넘기면 추가 요금이 발생할 수 있습니다.
- 카카오맵 기반 서울·경기 장소 검색과 자동완성
- 현재 위치를 출발지로 사용하고 지도에서 이동 방향 확인
- 실시간 이용 가능 수량을 반영한 출발 대여소 추천
- 따릉이가 0대인 가장 가까운 대여소 대신 다음 최적 대여소 안내
- 목적지와 가까운 반납 대여소 및 대체 대여소 추천
- 현재 위치 기반
가장 가까운 출발 대여소·가장 가까운 반납 대여소빠른 검색 - 카카오맵 REST API 기반 도보·자전거 경로선, 시간, 거리 계산
자전거도로 우선과최단 경로선택- 1시간권·2시간권·3시간권에 맞춘 최소 중간 반납·재대여 대여소 추천
- 지도에서 출발·도착 핀을 드래그해 장소와 경로 수정
- 출발 대여소 카드에서 따릉이 앱 열기
출발지와 도착지를 입력하지 않아도 현재 위치를 기준으로 필요한 대여소만 바로 찾을 수 있습니다.
가장 가까운 출발 대여소 찾기: 직선거리 기준 상위 5개 등록 대여소를 추린 뒤 도보 경로 거리를 비교합니다. 실시간 수량이 확인되면 따릉이가 1대 이상인 대여소만 추천하며, 조회에 실패하면 수량을수량 미확인으로 안내합니다.가장 가까운 반납 대여소 찾기: 직선거리 기준 상위 5개 등록 대여소까지의 자전거 경로 거리를 비교합니다. 신뢰할 수 있는 빈 거치대 정보가 없어 반납 가능 여부를 보장하지 않습니다.- 카카오 경로 조회에 실패한 후보는 성공한 후보보다 우선하지 않으며, 모든 경로 조회가 실패하면 직선거리 기준 예상 경로와 정확도 안내를 표시합니다.
모바일에서는 검색 결과가 나오면 검색 폼을 잠시 숨기고 로고 아래를 전용 지도로 채웁니다. 대여소명·주소·이동 시간·거리·수량 상태는 하단 카드로 보여줍니다. 위치 버튼은 누르는 순서에 따라 현재 위치 추적 → 보는 방향 표시 → 추적 종료 및 북쪽 기준 복귀로 동작하며, 방향 표시는 기기 센서와 브라우저 권한에 따라 제한될 수 있습니다. 위치 추적 중에는 현재 위치 마커와 지도 카메라만 갱신하고 대여소와 경로를 다시 계산하지 않습니다.
홈 버튼을 누르면 가까운 대여소 결과와 위치·방향 추적을 정리하고 이전 검색 화면으로 돌아갑니다. 기존 출발·도착 입력값, 이용권, 자전거도로 설정과 이미 찾은 전체 경로는 그대로 유지합니다.
지도 예상 시간의 오차를 고려해 각 이용권에서 5분의 안전 여유를 둡니다.
| 이용권 | 한 구간의 안전 이용시간 |
|---|---|
| 1시간권 | 55분 |
| 2시간권 | 115분 |
| 3시간권 | 175분 |
자전거 이동시간이 안전 이용시간을 넘으면 실제 자전거 경로 주변의 운영 대여소를 탐색합니다. 필요한 최소 개수부터 경유 후보를 검증하고, 모든 자전거 구간이 이용권 시간 안에 들어오는 조합을 추천합니다. 중간 반납·재대여에는 회당 약 3분을 총 소요시간에 반영합니다.
| 영역 | 사용 기술 |
|---|---|
| UI | Next.js 16, React 19, TypeScript |
| 지도 | Kakao Maps JavaScript SDK |
| 경로 계산 | Kakao Maps 도보·자전거 REST API |
| 서버 | vinext, Cloudflare Workers |
| 데이터 | 서울시 공공자전거 대여소 정보, 서울자전거 실시간 현황 |
| 방문 분석 | Vercel Web Analytics, PostHog Product Analytics |
| 테스트 | Node.js Test Runner, ESLint |
대표 서비스 주소인 ttarawaing.vercel.app에는 Vercel Web Analytics를 연결했습니다. 프로젝트 소유자는 Vercel Analytics 대시보드에서 다음 항목을 확인할 수 있습니다.
- 날짜별 익명 방문자와 페이지뷰
- 많이 본 페이지와 이탈률
- 유입 referrer
- 국가, 기기 유형, 브라우저, 운영체제
분석은 기능을 배포한 이후의 방문부터 수집하며 과거 데이터는 소급하지 않습니다. 방문자 값은 하루마다 초기화되는 익명 식별값을 기준으로 하므로, 여러 날에 걸친 고유 사용자 수가 아니라 일별 익명 방문자 수로 해석해야 합니다.
분석 스크립트에는 검색어, 장소명, 주소, 대여소 정보, GPS 좌표와 경로 데이터가 전달되지 않습니다. URL의 query와 hash도 전송 전에 제거합니다. 로컬 개발 환경과 별도 Sites 배포에서는 중복 집계를 막기 위해 이 분석 스크립트를 실행하지 않으며, 방문 통계는 대표 Vercel 주소로 유입을 통일해 확인합니다.
운영 환경에는 PostHog를 연결해 다음 익명 행동을 하나의 제품 퍼널로 확인할 수 있습니다.
- 서비스 진입
- 출발지·도착지 선택 완료
- 최적 경로 검색 시작
- 경로 결과 확인 또는 입력 검증 실패
따릉이 대여하기딥링크 클릭
가까운 출발·반납 대여소 검색과 잔여 자전거 새로고침도 별도 이벤트로 측정합니다. 검색어, 장소명, 주소, 대여소명, 위도·경도와 실제 경로 좌표는 수집하지 않습니다. 거리·소요시간·자전거 수량은 범위로 구간화하며, IP 기반 위치 추정·자동 클릭 수집·세션 녹화·히트맵·예외 수집은 비활성화합니다. 같은 브라우저의 익명 퍼널을 연결하기 위한 무작위 식별자는 로컬 저장소에 유지되며, 기본 브라우저·기기 정보와 함께 개인을 직접 식별하지 않는 형태로 수집됩니다. 브라우저의 Do Not Track 설정도 존중합니다.
PostHog 분석을 활성화하려면 배포 환경에 다음 변수를 설정한 뒤 다시 빌드합니다.
NEXT_PUBLIC_POSTHOG_PROJECT_TOKEN=your_project_token
NEXT_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
NEXT_PUBLIC_POSTHOG_ALLOWED_HOSTS=ttarawaing.vercel.app,ttarawaing.dnsxo0712.chatgpt.siteEU 리전 프로젝트는 NEXT_PUBLIC_POSTHOG_HOST에 https://eu.i.posthog.com을 사용합니다. 허용 호스트를 설정하면 목록에 포함된 서비스에서만 이벤트를 전송합니다.
- 대여소 위치는 서울시 공식 자료와 서울자전거 운영 목록을 사용합니다.
- 대여 가능 자전거 수는 서울자전거 실시간 현황을 우선 반영합니다.
- 실시간 연결이 실패하면 최근 운영 목록으로 추천을 유지하되 수량은
수량 미확인으로 표시합니다. - 신뢰할 수 있는 빈 반납 슬롯 데이터가 없어 반납 대여소는 운영 상태와 목적지까지의 경로를 기준으로 추천합니다.
- 카카오 경로를 불러오지 못한 구간은 실제 도로 경로와 구분되도록 직선 점선 예상으로 표시합니다.
자전거도로 우선은 가능한 자전거도로를 우선하는 옵션이며 모든 구간이 자전거 전용도로임을 보장하지 않습니다.
Node.js 22.13 이상이 필요합니다.
npm install프로젝트 루트에 .env.local을 만들고 다음 키를 설정합니다.
KAKAO_JAVASCRIPT_KEY=your_javascript_key
KAKAO_REST_API_KEY=your_rest_api_key
NEXT_PUBLIC_POSTHOG_PROJECT_TOKEN=your_project_token
NEXT_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
NEXT_PUBLIC_POSTHOG_ALLOWED_HOSTS=localhost개발 서버를 실행합니다.
npm run devnpm run lint
npm testnpm test는 배포용 빌드와 전체 테스트를 함께 실행합니다.