지하철역 시짓기 놀이
제작자는 지하철역 이름으로 N행시를 쓰는 것이 취미입니다. 계기는 경험수집잡화점의 온라인 모임에서 시작되었습니다. 그 후에도 지속해서 관심을 가지고 작성하고 있습니다. 현재는 농담으로 죽고 싶은 생각이 들 때마다 한편씩 쓴다고 합니다.
기존에는 NOTION을 통해 기록하던 방식에서 CLAUDE CODE를 이용해 웹페이지로 전환하는 작업을 진행했습니다.
서울, 부산 지하철 전 노선을 실제 지도 위에 좌표 기반으로 구현했습니다. 역 데이터는 Wikidata 및 공식 노선도를 참고하여 지속해서 보정하고 있습니다.
55+
총 커밋
22+
서울 노선
5+
부산 노선
개발 이력
- v2.6
AI N행시 + 페이징
2026-04-08- Claude API로 미작성 역에 AI N행시 자동 생성 (사랑·철학·유머 3가지 컨셉)
- 1·2호선 + 부산 1·2호선 156개 역 × 3컨셉 = 468편 AI 시 추가
- AI 시 ✨ 뱃지 표시 + 사용자 시는 ✍️ 324 뱃지로 구분
- 한 역에 여러 시가 있는 경우 페이징 UI로 모두 감상 가능
- 정렬: 사용자 시 → AI 사랑 → AI 철학 → AI 유머
- 진행률·노선별 카운트는 사용자 작성 시만 반영 (AI 시 제외)
- 관리자 모드에서 AI 시 위에 직접 새로 작성 가능
- v2.5
실시간 열차 보간 애니메이션
2026-04-07- 열차 마커를 SVG 지하철 차량 모양으로 리디자인 (호선별 시그니처 색상)
- 역간 실시간 위치 계산: 출발/도착/진입 상태별 보간
- 매초 위치 업데이트 + setLatLng으로 부드러운 이동 (마커 재생성 없음)
- 상태 전환 시 점프 방지 — 현재 위치에서 새 목표로 이어서 이동
- 서버 캐싱 15초 TTL로 서울 공공데이터 API 호출량 절감
- 방향(상행/하행)에 따른 윈드실드 + 호선 번호 표시
- v2.4
보안 + 성능 최적화
2026-03-28- Firestore 보안 규칙 적용 — 쓰기 권한을 관리자 이메일로 제한
- JWT 시크릿 교체 (플레이스홀더 → 랜덤 32바이트)
- Nanum Myeongjo 폰트 preload 비활성화 — 187개 woff2 → 2개 (2.98MB 감소)
- 역별 노선색 OG 이미지 카드 — 700개 역 각각 노선 색상 반영
- useCurvePoints Firestore 권한 오류 수정 (enabled 플래그)
- 환승역 중복 데이터로 인한 React key 경고 수정
- 서브 페이지 디자인 일관성 개선 (네비게이션, 컬러, 터치 타겟)
- v2.3
관리자 곡선 편집
2026-03-19- 노선도 곡선 편집 기능 — 관리자가 컨트롤 포인트로 노선 모양 조정
- Quadratic Bezier 보간으로 부드러운 곡선 표시
- Firestore에 곡선 데이터 저장 (curvePoints 컬렉션)
- 서비스명 변경: 지하철 N행시 → 지하철역 시짓기 놀이
- v2.2
시집 컨셉 디자인 + 진척도
2026-03-18- 시집(詩集) 컨셉 전면 리디자인 — 종이/먹/주서 색감
- 진척도 % 표시 (전체 도시 역 기준)
- N행시 감상 팝업에 랜덤 감상 버튼 추가
- 편집 중 모달 외부 클릭 닫힘 방지
- v2.1
Google 로그인
2026-03-17- Firebase Auth 기반 Google 로그인 추가
- 로그인 팝업에 Google 버튼 + 비밀번호 병렬 구성
- 허용 이메일 환경변수(ADMIN_GOOGLE_EMAIL)로 접근 제어
- v2.0
서버 DB 전환
2026-03-17- localStorage → Firebase Firestore로 데이터 저장소 전환
- 크로스 디바이스 N행시 동기화 지원
- 119개 seed 데이터 Firestore 마이그레이션
- bkend.ts 전면 재작성 (Firestore 직접 호출)
- v1.9
다크모드 제거
2026-03-17- 다크모드 전체 제거 — 라이트 모드 전용으로 전환
- v1.8
랜덤 버튼 분리 · 실시간 열차
2026-03-17- 랜덤 역 버튼을 보기/쓰기 두 가지 모드로 분리
- 서울 지하철 실시간 열차 위치 표시 기능 추가
- v1.7
세부 데이터 수정
2026-03-02- 서울 8호선 별내선 라우트 순서 수정
- 서울 5호선 하남선 누락 역 4개 추가
- 서울 3호선 일산선 역 데이터 수정
- 부산 동해선 역 데이터 전면 수정
- 부산 2·3·4호선 역 목록·좌표·라우트 전면 수정
- 부산 1호선 역 목록·좌표·라우트 전면 수정
- 7호선 역 순서 5곳 수정 + 좌표 7곳 보정 + 자양역 개명
- v1.6
데이터 정확도 개선
2026-03-02- 의정부 경전철 15개역 좌표 전면 수정 (Wikidata 기반)
- 5호선에서 마곡나루역 제거 (9호선/공항철도 전용)
- 4호선/5호선 라우트 누락역 수정
- 2호선 신정지선 추가 및 본선 역 순서 수정
- 4호선 안산~오이도 구간 역 순서 수정 (능길↔정왕)
- 4호선 당고개역 → 불암산역 개명 반영 및 좌표 수정
- 2~9호선 누락역 68개 추가 및 좌표 오류 45개 수정 (Wikidata 기반)
- 1호선 누락역 7개 추가 및 좌표 오류 6개 수정
- v1.5
인프라 변경
2026-03-02- bkend.ai 의존성 제거 → localStorage + 환경변수 인증으로 전환
- v1.4
노선 데이터 확장
2026-03-02- 신분당선 ID 충돌 수정 (s-sangcheon → s-sanghyeon)
- 신분당선 누락역 3개 추가 (논현, 신논현, 광교중앙)
- 신분당선 6개 역 좌표 교정
- 4개 노선 역 좌표 교정: 서해선, 김포골드라인, 인천1호선, GTX-A
- 1호선 연천 방면(경원선) 17개 역 추가
- 1호선 인천/천안 방면 노선 확장
- v1.3
UI/UX 및 성능 최적화
2026-03-02- 노선 선택 UI 반응형 적용 (모바일 select / 데스크톱 버튼)
- 라인 선택 시에만 역명 표시
- 미사용 ZoomTracker/useState 제거
- 모든 줌 레벨에서 역명 항상 표시
- 지도 성능 최적화 (줌 기반 Tooltip + useMemo)
- Tooltip 조건부 렌더링으로 변경
- v1.2
핵심 기능 추가
2026-03-02- 역 클릭 시 N행시 에디터 열기 + 역명 지도 표시
- 노선 범례 클릭으로 노선 필터 기능 추가
- 8개 노선 추가: 경춘·서해·GTX-A·김포골드·에버라인·의정부·인천1·인천2
- 모달 z-index 문제 수정
- v1.1
지도 기반 리디자인
2026-03-02- Leaflet 기반 실제 지도 위에 전체 지하철 노선도 리디자인
- 서울 1~9호선 + 주요 광역 노선 초기 구현
- v1.0
초기 구현
2026-03-02- 지하철역 시짓기 놀이 웹서비스 초기 구현
- 역 이름으로 N행시 작성·열람 기본 기능
- 서울·부산 도시 탭 전환
- N행시 목록 / 지도 뷰 모드