[React] API를 활용한 주소 좌표 변환 개발 📍

Ethan Lee·2021년 11월 1일
0

Background

회사에서 업무를 하다 보면 가끔씩 도로명주소나 지번주소를 좌표체계에 맞춰 변환해달라는 요청이 많았다. google 스프레드 시트에서 제공하는 변환은 일 사용량에 5,000 건 정도로 사용에 한계가 있어 vworld api를 활용해서 일 40,000건 정도를 변환할 수 있었다. 하지만 api 사용이 익숙하지 않은 사용자에겐 이 역시 어려운 일이었다. 따라서 csv 파일을 올리면 자동으로 선택한 좌표체계에 맞춰 변환해주는 사이트를 개발하였다.

Site

React로 구성과 제작은 매우 순조롭게 진행되었다. 특히, REACT-CSV-READER를 이용하여 csv 형태의 파일을 업로드하고 다운로드 받는 것까지 해결하였다. 또한 Vworld에서 제공하는 api를 이용하여 생각했던 기능은 구현이 가능했다.

제작하면서 어려웠던 점은 주말동안 맥북을 이용하여 개발하였을 때는 아무 문제가 없었는데, 막상 윈도우 환경에서 이를 사용하니 encoding 문제가 발생하여 글자가 깨지거나 좌표 변환이 안되는 문제가 발생했다. 이를 해결하기 위해 업로드하는 csv를 utf-8 포맷으로 제한하였고(이는 다른이름으로 저장에서 쉽게 변환 가능), cors 문제도 해결하기 위해 크롬 익스텐션 설치를 권장하였다. 이러한 부분은 향후에 추가적으로 업데이트를 통해 수정해나가야할 부분이다.

▽▼▽▼▽▼▽▼
link : geocoder
github : code

To be updated

앞서 해결하지 못한 encoding 문제와 cors 문제를 해결하고, 좌표에서 주소로 변경하는 기능을 추가해야겠다...

profile
hello world!

0개의 댓글