[2024.06.20] 모달에 Query string을 사용해 주소값 부여하기

Map 페이지 와이어 프레임

상세 페이지 모달 띄우면 이런 느낌

Query String

구상한 와이어프레임을 보면 MAP 페이지에는 지도 api와 숙박/맛집 정보를 가져오는 api까지 사용하여 서버와 통신할 일이 많은 작업이 포함되어 있어, 디테일 페이지로 이동하고 다시 돌아오면 괜한 로딩시간만 더 생기지 않을까 생각하였다. 때문에 디테일 페이지를 모달 형태로 띄워 뒤에 지도나 숙박/맛집 정보는 리렌더링 되지 않도록 하는 방법을 선택하였다.

다만 이럴 경우 모달을 띄운 상태로 새로고침을 하게 되면 모달 창이 유지되지 않기에 튜터님의 도움을 받아 query string을 이용해 주소값을 부여하였다.

이런 형태(출처: 나무위키)