← /projects • shipped 2024 Frontend-of-one Next.js · Recoil · Kakao Map

The Prestige

장지 위치 시각화 서비스.

WHY I STARTED THIS
대형 의료원에 시연하는 B2B 제품인데, 레거시의 느린 첫인상이 계약에 직접 영향을 줬습니다. 기능을 더하기 전에 '전환 경험'부터 다시 만들어야 한다고 판단해 전면 마이그레이션을 먼저 제안했습니다.
PAGES MIGRATED
0 8
6 weeks
Core pages
DEPLOY TIME
10m 2m
−80%
Manual → Vercel
PAGE REFRESH
every nav 0
SPA
No flash
DEMO RECEPTION
positive
Severance, large clinics

"ASP.NET 레거시의 진짜 문제는 무엇인가?"

DEF. 기능이 아니라 페이지 전환마다 발생하는 전체 새로고침이 의료원 시연에서 첫인상을 깎는 핵심 원인이었습니다. 배포는 사람이 빌드 산출물을 옮기는 방식이라 한 번에 10분이 걸렸습니다. 마이그레이션 목표는 SPA 경험을 6주 안에 — 기능 삭제는 0건.

01

Full migration, 6 weeks, 8 pages

ASP.NET 라우팅과 상태 관리 흐름을 Next.js로 1:1 매핑. 기능 삭제 없이 6주 안에 8개 핵심 페이지 이전.

02

Kakao Map + Recoil with no-refresh filters

필터 변경 시 새로고침 없이 지도와 검색이 즉시 반응하도록 상태 + 쿼리 파라미터를 동기화.

03

Recoil effects ↔ LocalStorage

필터 상태를 LocalStorage와 양방향 동기화 — 새로고침해도 사용자가 보던 필터가 그대로 유지.

04

Drove API design, then implemented

백엔드와의 협업에서 응답 구조를 직접 설계해 요청. 프론트엔드 사용 시점에 가장 효율적인 모양으로.

05

Manual builds → Vercel CI/CD

수동 빌드 파일 전달 방식을 GitHub → Vercel 자동 배포로 전환.

Eight pages. No flashes. No friction.

  • 8개 핵심 페이지 6주 마이그레이션 완료, 기능 삭제 0건.
  • 배포 리드타임 10분 → 2분 (−80%).
  • 세브란스 등 대형 의료원 시연 긍정 피드백.