플러스프로젝트 배경
1) 예상 리스크 및 대응 계획 - 다수의 위치 마커를 지도에 렌더링하면서도 클러스터링과 리스트 동기화가 끊김 없이 동작하도록 하는 성능 설계가 필요 - 재검증 대상이 대량으로 몰릴 때 외부 검증 신호 호출이 과도하게 집중되지 않도록 큐 기반 처리량 제어 설계가 필요 - 수천 건 규모의 파트너 데이터를 필터링·정렬하면서도 응답성을 유지하는 가상 스크롤 및 서버사이드 페이지네이션 설계가 필요 - 주소 기
프로젝트 성과
지도-리스트 양방향 동기화 구조 설계
지도 뷰포트와 우측 리스트 패널이 커스텀 훅으로 실시간 동기화되는 구조를 설계합니다
대량 데이터 가상 스크롤 테이블 구현
TanStack Table과 가상 스크롤을 결합해 수천 건 규모 데이터도 끊김 없이 탐색 가능한 테이블을 구현합니다
큐 기반 재검증 배치 파이프라인 구축
Redis 큐로 재검증 대상을 버퍼링해 처리량을 조절하는 배치 스케줄러를 설계합니다
지오코딩 연동 동적 등록 폼 구현
React Hook Form + Zod로 유형별 동적 필드와 지오코딩 좌표 자동 산출을 구현합니다
핵심 기능
파트너 네트워크 맵
항만·창고·포워더 등 위치 정보를 가진 파트너를 Leaflet 지도 위에 마커로 표시하고, 마커 클릭 시 우측 패널에서 상세 정보와 검증 상태를 확인할 수 있는 지도 기반 관제 화면을 구현합니다
진행 단계
지도 데이터 레이어 및 지오코딩 설계
2026.08
위치 기반 파트너 좌표 스키마 설계, Leaflet 마커 클러스터링 및 지오코딩 연동 구조 정의
프로젝트 상세
1) 포트폴리오 소개 검증 허브 MVP를 확장해, 항만·창고·포워더 등 위치 기반 파트너를 Leaflet 지도 위에서 조망하고 관리자 데이터 테이블·주기적 재검증 자동화·신규 등록 워크플로우까지 통합 관제할 수 있는 네트워크 플랫폼을 React + Supabase 기반으로 설계·구현합니다. 2) 작업 범위 - 파트너 네트워크 맵: 항만·창고·포워더 등 위치 정보를 가진 파트너를 Leaflet 지도 위
