map API 컴포넌트 시 임시 서버로, festival용 map 서버를 개설하였다. test 결과, react-query
설정 시 결과적으로 잘 나타나는 것을 확인했다. 앞으로도 유용하게 사용할 일이 많을 거 같아, 해당 이론 지식을 갖게 된 것이 매우 기뻤다.
이런 저런 시행착오를 겪으며, react-query
를 테스트 해보았다. typescript
를 사용하고 있기 때문에, 더욱 사용방법을 숙지하는데 시간이 걸렸던 거 같다. 선언적 컴포넌트를 위해, 공식 문서의 suspense
와 react-error-boundary
를 활용해보았지만, 원하는대로 움직이지 않았다. 사례 가운데, error-boundary
클래스를 직접 설정하여, 작업한 블로그가 있던데, 일단은 시간이 없으니, 기존의 명령형 컴포넌트 형식으로 진행하며, 나중에 여유가 된다면, 공부하여 반영해보아야 겠다.
서버와 이야기한 결과, db의 정제된 축제 데이터를 기반으로 축제 오브젝트들이 생성되도록 정했다. festival id 를 기반으로 lat,lng 값을 설정하여, KakaoMap 컴포넌트로 전달한다. KakaoMap 컴포넌트에서는 받은 coord (좌표) 값을 기준으로 카카오 맵을 하도록 한다.
로직 설계를 마쳤으니, map을 렌더링 한다. 시간이 된다면, 기본 좌표 디자인까지 완성할 생각이다. 상세 내용 페이지와 함께 나와야 하는 부분을 명심해서 디자인 하도록 하자.