📝 한줄 요약
비용과 정확도를 저울질한 뒤 Photon API(무료) + 직접 입력 fallback으로 “오타 방지”라는 목표를 달성했다.
👥 이런 분께 추천
데이터 입력 필드에서 오타를 방지하고 싶은데, API 비용이 걱정되는 경우
검색 기능을 만들되 여러 선택지 중 최적을 고르는 과정을 보고 싶은 경우
비교표를 통해 의사결정 근거를 기록하는 방법을 배우고 싶은 경우
문제 상황
초과근무 신청 화면에서 필드매니저가 미팅 주소를 입력합니다. 현재 시트에는 "Las Angeles" 같은 오타가 있었어요. 타이핑 오타를 원천 차단해야 했습니다.
검증 방법 비교
네 가지 방법을 놓고 고민했습니다.
방법
어떻게
장점
단점
검색형 드롭다운 (Photon) ✅ 선택
입력하면서 실시간 검색, 일치하는 주소 고르기
오타 자동 교정, 무료, 사용자 부담 적음
Google보다 정확도 낮음, 아주 새로운 건물 미포함 가능
형식 검사만
”도시, 도로명, 번지” 패턴 확인
가볍고 빠름
존재하지 않는 주소도 통과 (오타 방지 실패)
Google Places 재검증
Photon으로 받고 Google으로 재확인
정확도 높음
비용 발생, 복잡도 증가
수기 입력 + 회계담당자 확인
직접 타이핑 허용, 나중에 재확인
제약 없음
오타가 오래 남음
Photon + 직접 입력을 선택한 이유 5가지
1. 오타 방지가 실제로 작동함
사용자가 “Las Angeles”를 치면 검색 결과가 없습니다
자연스럽게 올바른 철자를 찾아야 하고, “Los Angeles”를 찾으면 자동 교정됩니다
타이핑 실수(Las→Los, Angles→Angeles 등) 대부분이 이 과정에서 걸러집니다
2. 가장 흔한 오타 90%는 잡힘
정확한 철자를 강제하는 것과 유사한 효과를 얻습니다
전혀 다른 주소를 치는 경우까지 막을 수는 없지만, 현실적인 목표입니다
3. 특수한 경우 직접 입력으로 빠져나갈 수 있음
정말 새로운 건물이거나 매우 작은 위치는 Photon에 없을 수 있습니다
“Can’t find it? Enter manually” 버튼을 누르면 텍스트를 직접 타이핑할 수 있습니다
목표는 오타 방지이고, 정말 검색에 없는 곳은 그렇게 처리하는 게 낫습니다
4. 비용이 없음
Google Places는 유료 API (1,000건에 $2~40)
Nominatim은 자동완성 정책상 클라이언트 직접 사용 금지 (공식 정책 원문 확인함)
Photon은 무료고, OpenStreetMap 데이터 기반이라 이 용도로 설계됨
5. 나중에 업그레이드 가능
정확도가 더 필요하면 Google Places를 추가하거나
회계담당자의 재확인 단계를 붙이는 식으로 검증을 강화할 수 있습니다
지금은 Photon으로 시작하고 나중에 개선하는 게 현실적입니다
구현 방식
기본: Photon API 검색형
사용자 입력 → Photon API 검색 → 일치하는 주소 목록 → 사용자 선택 → AddressField에 저장Fallback: 직접 입력
"Can't find it? Enter manually" 클릭 → 검색 모드 해제 → 텍스트 직접 타이핑 → 저장두 방식을 AddressField 컴포넌트 안에서 토글로 전환할 수 있습니다.
배운 점
의사결정을 문서화하면 구현이 흔들리지 않는다
비교표를 만들면서 다섯 가지 선택 이유가 명확해졌습니다. 덕분에 구현할 때 “혹시 Google을 써야 하나?”라고 다시 고민하지 않아도 됐어요. 나중에 “왜 Photon으로 했지?”라 고 다시 봐도 근거가 명확합니다.
비용 조사는 코드 작성 전에
Nominatim의 정책을 미리 확인했으니 “API 다 만들고 보니 정책 위반이었다”는 낭패가 없었습니다. 돈이 드는 결정은 먼저 요금 문서를 읽고 진행하는 게 중요합니다.
솔직한 소감
AI로 딸깍하면 다 될 줄 알았는데 사람의 의사결정이 계속해서 필요했습니다.
그리고 기능 하나 개발하는 데 수많은 의사결정을 하나씩 해나가는 것이 나름 재미있기도 합니다.
