Ride Analytics 라이드 애널리틱스

● Active Cycling Tech Next.js 15 Python Supabase Kakao Maps

Unified cycling data platform that ingests GPX/FIT files, runs a 4-stage ETL pipeline, and surfaces interactive ride dashboards with GPS route heatmaps and performance comparisons. GPX/FIT 파일을 수집해 4단계 ETL 파이프라인을 실행하고, GPS 경로 히트맵과 성능 비교 기능을 갖춘 인터랙티브 라이드 대시보드를 제공하는 통합 사이클링 데이터 플랫폼.

Problem 문제 정의

📂
Fragmented Data데이터 분산
GPX and FIT files stored across devices with no unified analysis view.GPX와 FIT 파일이 여러 기기에 분산돼 통합 분석이 불가능.
🗺️
No Route Insight경로 인사이트 부재
No way to visualize frequent routes, hot segments, or elevation patterns across rides.자주 달리는 경로나 구간별 고도 패턴을 시각화할 방법이 없음.
📉
Manual Comparison수동 성능 비교
Comparing performance across rides required manual spreadsheet work with no trend awareness.라이드 간 성능 비교를 위해 수동으로 스프레드시트를 작성해야 했음.

Approach 접근 방식

🔄
4-Stage ETL + RSC Dashboard4단계 ETL + RSC 대시보드 A Python pipeline ingests raw GPX/FIT files through parse → normalize → enrich → store stages, persisting structured records in Supabase. Next.js 15 RSCs fetch and render data server-side for fast initial loads, with Kakao Maps SDK for interactive GPS heatmaps. Python 파이프라인이 GPX/FIT 파일을 파싱 → 정규화 → 보강 → 저장의 4단계로 처리해 Supabase에 구조화 데이터를 적재. Next.js 15 RSC가 서버에서 데이터를 패칭·렌더링해 초기 로드를 빠르게 하고, Kakao Maps SDK로 인터랙티브 GPS 히트맵을 제공.

Features 주요 기능

01
Ride Data Dashboard라이드 데이터 대시보드
Aggregated statistics — distance, elevation, speed zones, heart rate zones — rendered by RSC with no client-side data fetching.거리, 고도, 속도 존, 심박수 존 등 집계 통계를 RSC로 서버 렌더링. 클라이언트 데이터 패칭 없이 즉시 로드.
02
Route Heatmap경로 히트맵
GPS coordinate density rendered as a heatmap over Kakao Maps, with GPS fingerprinting to detect repeated route segments.Kakao Maps 위에 GPS 좌표 밀도를 히트맵으로 렌더링. GPS 핑거프린팅으로 반복 경로 구간을 감지.
03
Performance Comparison성능 비교
Side-by-side ride comparison with power, cadence, and pace overlays. Trend lines show improvement over time.파워, 케이던스, 페이스 오버레이로 라이드 간 나란히 비교. 트렌드 라인으로 시간에 따른 향상을 시각화.
04
Course Recommendation코스 추천
EXIF geotagging on photo uploads auto-associates images with ride coordinates, enriching route pages with contextual photos.사진 업로드 시 EXIF 지오태깅으로 이미지를 라이드 좌표에 자동 매핑해 경로 페이지에 맥락적 사진을 제공.

Architecture 아키텍처

Client Server External Database Browser Client Next.js 15 RSC App Router Python Pipeline Parse→Normalize→Store GPX / FIT Files Raw Input Kakao Maps SDK GPS Heatmap Supabase PostgreSQL

Metrics 성과 지표

ETL Pipeline
4
stages
GPS Fingerprint
Route
dedup
EXIF Geotagging
Auto
photo map
Render Mode
RSC
server components

Before / After 도입 전후 비교

Aspect Before After
Data access Files scattered across devices Unified Supabase store
Route view No heatmap or GPS overlay Kakao Maps GPS heatmap
Performance Manual spreadsheet comparison Auto trend + side-by-side
Photos Unlinked to ride context EXIF geotagging → route page
Tech Stack
Next.js 15 RSC Python Supabase PostgreSQL Kakao Maps SDK GPX / FIT EXIF