본문 바로가기

프로젝트/복지맵(일시중단)

[복지맵 프로젝트] 2024.04.25 ~ 26 진행사항 점검 [CH02]

반응형

프로젝트의 컨셉

현재 생각하고 있는 프로젝트의 컨셉은 사용자가 사이트에 접속을 하면 부산 행정 구역을 바로 확인할 수 있게 하고, 각 행정 구역을 클릭하면 구/군 별로 사용자가 이용할 수 있는 복지프로그램/기관 목록을 리스트 형식으로 표시하는 것이다.

 

 

이 때 사용자가 정확한 위치 정보를 확인 하고자 한다면, 이 때는 리스트의 상단에 지도보기(길찾기) 아이콘을 클릭하면 즉시, 해당 지역의 위치좌표와 마커가 표시되도록 한다.

 

현재 까지 구현 단계(2024.04.25 ~04.26)

 위  컨셉에 따라 사용자가 루트 페이지에 접속하면 부산의 각 행정구역을 시각적으로 확인하고 선택할 수 있도록 해당 이미지를 SVG 를 사용하여 각 행정구역 별로 이벤트를 등록 가능하도록 작업하였다. 피그마로 작업하였기 때문에, 그나마 수월했지만 수작업으로 하였기 때문에, 거의 3시간을 잡고 그렸다.

 

 

해당 svg 는 id 속성이 부여되도록 하여 export 하였고, 이를 루트 페이지에 들고가서 렌더링 하였는데, 결과적으로는 잘된 듯하다. 조금 부자연스러운 부분이 없지 않아 있는데, 이 부분은 프로젝트를 진행하면서 계속 수정하면 될 듯 하다.

 

 

 

 

앞서 과정이 25일 까지의 작업이었다면, 26일 에는 슬라이드 버튼이 하나 추가 되었다. 26일에 바짝 진행을 하려고 했으나, NestJS 서버 환경에서 도커와 로컬 개발 서버 간의 설정 차이로 PostgreSQL 의 연결이 실패하는 문제가 발생하여, 해당 문제를 해결하는데 많은 시간을 소요 했고, NestJS 라는 프레임워크 자체에 대한 숙련도 미흡으로 이를 별도로 공식문서와 블로그, 지피티 등을 사용하여 부족한 부분을 채워나간다고 시간을 추가로 소요했다. 여러모로 계획과는 다르게 전개되어서 아쉬운 날이었다.

 

 

 

현재 까지 애로사항 점

무엇이든 데이터를 사용할 수 있게끔 전처리하는 것이 어려운 것 같다. 피그마를 사용해서 지도를 그리는 것에도 많은 시간을 소요했고, 이를 프로젝트에 자연스럽게 적용하기 위해서 또 다시 별도의 데이터 정리가 필요했다. 이벤트를 등록하고 이에 따른 처리 로직을 작성하는 것은 얼마 걸리지 않았지만, 필요한 데이터를 전처리하는데 많은 시간을 소요 했었고, 사이사이에 잘못 작성된 부분이 있어서 이 부분을 찾기 위해 시간을 더 투자했다.

 

백엔드 환경을 이해하고 이를 설정하는 데에도 많은 어려움이 따랐다. 도커에 대한 이해 부족과 맞물려 이를 이해하고, 활용하기 위해 별도의 시간이 추가로 소요되었다. 

 

 

일단은..

현재 프론트엔드의 경우에는 PWA 를 적용하였고, 향후 AWS S3 와 클라우드 프론트를 사용하여 정적 웹 호스팅을 시도할 것인데, 이를 우선적으로 도입하여 배포 부터 해두고 시작하는게 나을지 고민 중이다. 최대한 짧은 기간 내에 프로젝트를 마무리하고 계획 중인데, 현재 프로젝트의 40% 비중은 새롭게 시도하는 것이라서 많은 시간이 소요될 것 같다. 그래서 배포에 투자하는 시간 보다 우선적으로 프로젝트의 완성도를 높이는게 나을지, 안정적인 배포 파이프라인을 구축해서 향후 직면할 어려움을 미리 해결해둘지 고민이 된다. 

 

일단은 조금씩 시간을 내서 배포라인을 구축하는 등 작업의 스케줄을 최대한 나눠서 동시에 진행하도록 해야 겠다.

 

우선은 내일 백엔드 로부터 받아온 데이터를 프론트엔드에서 정제하고, 이를 카카오 지도와 맵핑하는 작업, 상세 서비스 페이지에서 각 구별 기관 내역과 각 기관에서 제공하는 서비스 목록을 리스트로 보여주는 기능까지 진행할 예정이다. 그 이후에 프로젝트 진행 사항을 돌아오는 시간을 가져야 겠다. 주말에 뭐하는 짓인가 싶지만, 노는 것은 일단 현재 벌여 놓은 일 부터 처리하고 그 때 가서 생각하자.

반응형