사이드 프로젝트

코로나 맵 1

귀요미찰쓰 2021. 11. 27. 17:49
728x90
반응형
반응형

그전에 환경설정 부분은 여기에 들어가시면 따라하시면 됩니다.

url: https://highschool-ai-scientist.tistory.com/41

 

코로나 맵 환경설정

1. ejs Snippets EJS란? EJS는 Embedded JavaScript templating의 약어로서, 자바스크립트로 HTML 마크업을 생성할 수 있는 간단한 템플릿 언어입니다. 2. NODE JS 다운로드 링크: https://nodejs.org/ko/ 제가..

highschool-ai-scientist.tistory.com

 

일단 저는 네이브 맵 api 말고 kakao 맵 api를 이용하였습니다.

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

1. 저기 위에 있는 링크에 들어가서 아래 사진처럼 APP KEY 발급 부분에 들어가서 키를 발급 받는다.

 

2. 아래 사진에 나오는 것처럼 애플리케이션 추가하기를 눌러줍니다.

3. 앱 이름에는 내가 원하는 앱의 이름 아무렇게나 입력을 하면되고 사업자명에는 자신 이름 또는 아무거나 입력해도 솔직히 상관이 없다.

 

4. 우리는 JavaScript키를 사용할 것입니다.

 

5. Web 플랫폼 등록을 해준다. 이걸 안하면 프로젝트를 node를 통해서 못 실행해준다.

6. 지도를 생성해주기

위에 있는 소스 코드를 긁어올 것인데요. 그리고 저기에 appkey='발급 받은 APP KEY를 사용하세요 부분에' 제가 아까전에 사용할거라고 말했던 JS key를 가져오시면 됩니다.

 

8. 서버 가동

터미널에다가 nodemone ./bin/www쳐준다.

9. 결과보기

chrome을 키시고 localhost:3000 쳐주면 아래처럼 이렇게 결과가 나오는 것을 볼 수 있습니다.

 

 

 

 

 

 

 

 

참고

제 블로그에 있는 정보 말고도 더 공부하고 싶으신 분들은 아까전에 제가 위에 카카오 맵 api 제공하는 사이트 url에 들어가셔서 아래 사진에서 동그라미 칠해져있는 Web 부분에 들어가서 자신이 이용할 소스코드 가져와서 공부하시면 됩니다.

 

반응형