[복지맵 프로젝트] ~ 2024.04.29 진행사항 점검[CH03]

현재 까지 진행사항

아래 시연 GIF 는 27일 경에 진행된 것인데, 각 SVG 맵에서 구분된 구역을 포커스 하면 해당 지역의 서비스 상세 내역이 아코디언 형식으로 조회할 수 있도록 목록이 렌더링되는 형태로 구현해두었다.

 

 

 

그리고 현재는 카카오 MAP SDK 를 사용해서 각 구/군별로 복지기관의 위치를 다중 마커로 표시하였고, 아래 이미지에는 안 나와 있지만, 현재 사용자의 좌표 또한 마커로 표시되도록 해두었다. 사용자 위치 같은 경우에는 HTTPS 에서만 지원해준다는데, 어차피 배포할 때는 HTTPS 로 할 것이므로 큰 문제는 없을 듯하다. 

 

 

 

 

향후 방향성

길찾기 기능

길찾기 기능을 구현하려고 한다. 사용자가 서비스 목록을 알더라도 그 기관이 어디에 위치해 있는지, 현재 위치에서 얼마나 멀어져 있는지 등을 살펴볻 수 있도록 편의성을 목적으로 제공하려고 한다.

 

따라서 해당 기능을 구현하기 위해 다양한 도구를 찾아보고 있는데, 카카오 모빌리티에서 공식적으로 지원하는 길찾기 기능은 자가용을 사용해서 이동하는 경우에 대한 정보만 제공해주고 있었다. 물론, 도보의 경우도 시간 표기는 가능할 것 같은데, 자동차가 다니는 길을 기준으로 보기 때문에 어떻게 될지는 모르겠다. 

 

우선은 길찾기를 통해서 사용자가 쉽게 찾아갈 수 있는 참고용 자료로서 쓰일 수 만 있다면 충분하다고 보기 때문에 우선 구현해 봐야할 사항으로 정했다.

 

배포

현재 프론트엔드의 경우 AWS S3와 CloudFront 를 사용해서 정적 웹 사이트 형식의 배포를 진행할 예정인데, 오늘 이어서 마무리할지 아니면 내일 시도할지는 고민해봐야 겠다. 일단은 늦어도 내일 배포를 해보는 방향으로 프로젝트를 진행해볼 것이다.

 

 

현재까지 애로사항

현재 까지 경험한 애로 사항 중에서 GSAP 모듈에 대한 타입 선언이 인식되지 않아서 빌드가 실패하는 문제가 발생했었다. 다행히 복잡한 문제는 아니여서 빠르게 해결할 수 있었다. 현재부터 애로사항이 될 부분은 길찾기 기능을 구현할 때 각 좌표 지점을 선으로 이어주는 것인데, 어떻게 될지는 모르겠다.

 

또한 PWA 를 설정했기에 백그라운드 환경에서도 캐싱처리된 데이터를 기반으로 프로덕션 서버가 실행이 된다. 즉, 오프라인에서도 웹 사이트가 실행이 되는데, 이 문제로 인해서 기존 개발서버의 포트와 프로덕션 서버 간의 카카오맵 SDK 호출이 중복이 되면서 약간의 충돌 문제가 발생했었다. 이 부분은 PWA 에 캐싱된 데이터를 제거함으로써 해결할 수 있었는데, 나중에 시간을 내서 서비스워커와 PWA 에 대한 학습을 좀 해야할 것 같다는 경각심이 생겼다.