Kakao API 카카오 지도 API 사용법

Kakao에서 지원하는 지도API를 이용하여 지도를 생성해보겠습니다.

 

 

1. 카카오 개발자(developers)사이트에 방문합니다. 

https://developers.kakao.com/

Kakao Developers

 

 

2. 상단에 내 애플리케이션을 클릭합니다.

클릭 한 뒤에 로그인 창이 나오면 로그인 해줍니다.

 

 

3. 애플리케이션 추가하기 버튼을 눌러 줍니다.

저는 이미 애플리케이션 2개를 만들어서 (2)라고 보입니다.

 

 

4. 애플리케이션 추가하기

(위 사진은 예시입니다)

앱아이콘, 앱 이름, 사업자명을 넣고 하단 체크박스를 체크해 준 뒤에 저장버튼을 누릅니다.

(앱 아이콘은 안넣어도 무방합니다)

 

성공적으로 만들어 지면 이러한 모습입니다.

이제 만들어진 것을 클릭합니다.

 

 

5. 플랫폼 등록

저희는 Web에서 지도를 구현하는게 목표이므로 Web플랫폼 등록을 클릭합니다.

 

사이트 도메인을 적어주고 저장을 클릭합니다.

예) http://localhost:3000

 

 

6. Kakao 지도 API 사이트에 방문합니다.

https://apis.map.kakao.com/

방문한뒤에 Web을 클릭합니다.

Sample에 지도 생성하기를 클릭하고 Javascript + HTML코드를 복사합니다.

 

 

7. 코드에디터(Vscode등)를 킨후에 붙여넣기

13번째 줄에 발급받은 APP KEY를 사용하세요 에 APP KEY(인증키)를 넣어야 하는데

이 APP KEY(인증키)는 내 애플리케이션 > 앱설정 > 요약정보에 있다.

 

정보보호로 블러처리 하였습니다.

여기서 JavaScript키를 복사해서 위 코드에 발급받은 APP KEY를 사용하세요에 넣으면 된다.

 

 

8. 자신이 쓰는 브라우저를 실행하고 주소(도메인)란에 아까 설정해둔 사이트 주소(도메인)를 입력합니다.

(예제같은경우 http://127.0.0.1:5500입니다.)