지도
-
next.js 에 kakao map 띄우기 (feat. react-kakao-maps-sdk)FrontEnd/Next.js 2024. 2. 6. 15:31
카카오 개발자 센터에 들어가보면 api key (자바스크립트 키) 를 발급 후 아래 코드를 삽입하라고 한다. "API를 로딩하는 스크립트 태그는 HTML파일안의 head, body 등 어떠한 위치에 넣어도 상관없습니다. 하지만, 반드시 실행 코드보다 먼저 선언되어야 합니다." 리액트 같은 경우에는 intex.html에 작성하면 되고 next.js 같은 경우 layout 같은 곳에 Script 태그를 불러와 삽입하면 된다. 하지만 이 같은 번거로운 작업을 JaeSeoKim 님이 배포하신 라이브러리를 사용하면 비교적 간단하게 처리 할 수 있다. next.js 같은 경우 example에 따르면 .env 에 아래와 같이 작성해두면 script 문을 따로 작성하는 대신 useKakaoLoader를 통해 api 키..