59,400원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
404에러가 뜨네요 ㅠㅠ
404에러가 뜨네요 ㅜㅜㅜ 어떻게 하는거죠..
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
카카오 api 발급 및 적용중에 upload 페이지가 뜨지를 않아서요.
안녕하세요. 수업 잘 보고 있습니다. 카카오 api 발급 및 적용까지 잘 따라왔는데.. 다하고 보니 업로드 페이지가 뜨지를 않아서요. 몇번이고 다시 해봤는데 안되는데.. 혹시 방법을 알려주실수 있나요?
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
키 발급 부탁드립니당!!
저도 네이버 api 키를 발급받지 못해서 wlswnzz15@gmail.com으로 key값을 배포해주시면 감사하겠습니다!
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
코드를 다운받을 수 있는 곳이 있나요?
오타가 발생하면 그걸 찾느라, 너무 오래걸리는 것 같습니다. 코드를 다운 받고 싶은데, 어디서 받을 수 있을까요?
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
서버 구축
안녕하세요 먼저 좋은 강의 제공해주셔서 감사합니다. 덕분에 진행하고 있는 프로젝트에 많은 도움이 되었습니다. 추가로 궁금한 점이 있어 문의드려요 사이트를 완성을 했고 제 형식에 맞게 수정하여 배포하고 싶습니다. 지금은 제 컴퓨터에서만 접속이 되는데 다른 사람들도 접속할 수 있게 하고 싶습니다. 서버 구축 하는 방법을 알 수 있을까요?
- 해결됨코로나맵 개발자와 함께하는 지도서비스 만들기 2
인포박스가 생성되지 않아요
업로드 페이지에서 마커를 클릭했을 때 인포박스가 생성되지 않습니다. 여러번 다시 해봤는데 그대로네요.. 무엇이 문제인지를 모르겠어요. 도움 요청합니다ㅠ upload.js 코드입니다. const mapContainer=document.getElementById("map"); const mapOption={ center:new daum.maps.LatLng(37.554477,126.970419), level:3, }; let map=new daum.maps.Map(mapContainer, mapOption); let infoWindow = new daum.maps.InfoWindow({ zIndex:1, }); let markerList=[]; let ps=new daum.maps.services.Places(); searchPlaces(); function searchPlaces(){ let keyword=$("#keyword").val(); ps.keywordSearch(keyword,placesSearchCB); } function placesSearchCB(data, status){ if(status===daum.maps.services.Status.OK){ displayPlaces(data); }else if(status===daum.maps.services.Status.ZERO_RESULT){ alert("검색 결과과 존재하지 않습니다.") return; }else if(status===daum.maps.services.Status.ERROR){ alert("검색 결과중 오류가 발생했습니다.") return; } } function displayPlaces(data){ let listEl=document.getElementById("placesList"); let bounds=new daum.maps.LatLngBounds(); removeAllChildNodes(listEl); removeMarker(); for(let i=0;i<data.length;i++){ let lat=data[i].y; let lng=data[i].x; let address_name=data[i]["address_name"]; let place_name=data[i]["place_name"]; const placePosition=new daum.maps.LatLng(lat,lng); bounds.extend(placePosition); let marker=new daum.maps.Marker({ position:placePosition, }); marker.setMap(map); markerList.push(marker); const el=document.createElement("div"); const itemStr=` <div class="info"> <div class="info_title"> ${place_name} </div> <span>${address_name}</span> </div> `; el.innerHTML=itemStr; el.className="item"; daum.maps.event.addListener(marker,"click",function(){ displayInfowindow(marker,place_name,address_name,lat,lng); }); daum.maps.event.addListener(map,"click",function(){ infoWindow.close(); }); el.onclick=function(){ displayInfowindow(marker,place_name,address_name,lat,lng); }; listEl.appendChild(el); } map.setBounds(bounds); } function displayInfowindow(marker,place_name,address_name,lat,lng){ let content=` <div style="padding:25px;"> ${place_name}<br> ${address_name}<br> <button>onClick="onSubmit('${title}','${address}',${lat},${lng});"등록</button> </div> `; map.panTo(marker.getPosition()); infoWindow.setContent(content); infoWindow.open(map,marker); } function onSubmit(title,address,lat,lng){ $.ajax({ url:"/location", data:{title,address,lat,lng}, type:"POST", }).done((response)=>{ console.log("데이터 요청 성공"); alert("성공"); }).fail((error)=>{ console.log("데이터 실패"); alert("실패"); }); } function removeAllChildNodes(el){ while(el.hasChildNodes()){ el.removeChild(el.lastChild); } } function removeMarker(){ for(let i=0;i<markerList.length;i++){ markerList[i].setMap(null); } markerList=[]; }
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
infowindow_wrap부터 css가 적용이 안돼요
안녕하세요 강사님 infowindow_wrap부터 css가 적용이 안돼요 밑에 하단까지 적용이 안되어서 투명창 그대로 구현이 되는데 제가 잘못한 부분을 찾을 수가 없네요. 코드 보시고 잘못된 부분 찾아주시면 감사드리겠습니다. - 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
화살표 함수 두번 쓰는 이유가 궁금합니다.
안녕하세요 강의 잘 듣고 있습니다 이번 강의를 듣고 궁금한점이 생겼는데 'for문이 돌면서 함수가 실행되어 버리기 때문에' 그것을 방지하기 위해 getClickHandler안에 다시 한번 함수를 작성해주신다고 하셨는데 이부분 설명을 제가 이해가 잘 안되서 한번 더 설명해주실수 있을까요? 왜 함수를 화살표함수 한번으로 하면 안될까요?? 구글링해보니까 카레함수라고도 하더라고요 근데 잘 이해가 안됩니다ㅜㅜ 설명해주시면 감사하겠습니다
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
이거 좀 너무 "코드보고 따라치세요" 식 아닌가요?
제가 이 강의의 기초강의인 코로나맵1을 안듣고 바로 2를 들어서 그런지 모르겠지만.. 아직 만들지도 않은 tag들에 CSS를 적용 하고 API들의 기능들에 이런저런 설명도 하나 없고~ 너무 따라치세요~ 식 강의 아닌가요? 이 강의 5분 들으면 공식문서 뒤져서 id네임은 꼭 저렇게 쓰라고 정해진건지~ map div에 style은 꼭 인라인으로 써야하는 건지 Event는 뭔지, 왜 addEventListener가 아니고 addListener인지 이거저거 하나하나 뒤져가면서 진도를 나가고 있습니다. 이거 강의가 5만원가까이 되는걸로 기억하는데 결과물은 어떨지 모르겠으나 강의 내용이 너무너무 부실하네요!!
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
마커 클러스터 내의 텍스트 속성 지정 방법이 궁금합니다.
클러스터의 크기를 키웠더니 사진과 같이 텍스트가 위로 쏠려 출력되고 있습니다. 정중앙에 배치하고 싶은데 어떻게 하면 될까요? 답변 주시면 감사하겠습니다.
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
로딩 속도를 높이는 방법이 궁금합니다.
강의 내용과 다른 데이터를 data.js 파일에 넣었더니 데이터의 양이 많아(약 1800개) 로딩 속도가 굉장히 느린데 이를 해결할 수 있는 방법은 없는지 궁금합니다. 답변 주시면 감사하겠습니다.
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
헉! 저도 회원가입에서 막혔네요
해외에서 강의를 듣고 있는데요.. 저도 아래 질문하신 분 처럼.. 회원가입에서 막혔습니다. 핸드폰 인증이 필수네요 ;;; 잠시 강의 들을 동안만 사용할 수 있도록 API Key를 부탁드려도 될까요 ? ㅠㅠ m3muse@gmail.com
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
-g로 설치하는 이유가 있나요?
아직 프로젝트 시작전인데요^^ 이 3가지 모듈들을 global로 설치하는 이유가 있을까요? express 는 늘 -s 옵션으로 설치하고 nodemon은 -D 옵션으로 설치해왔었는데.. 혹시 코로나맵 프로젝트에는 -g가 꼭 필요한건가 싶어 질문드립니다^^
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
강의 내용 외 문의
혹시 강의와 관련된 질문은 아니지만 현재 서비스 중인 "코로나 맵" 기능중에 표시된 마커가 일정한 시간이 지나면 색깔이 달라지고 사라지는 기능과 DB에 올릴 때 강의에서는 네이버 지도에서 띄운 내용을 바탕으로 등록이 되는데 제가 원하는 내용으로 버튼을 누르면 자동입력이 되도록 하는 기능을 구현하려면 어떻게 해야 할까요? 정확한 답변을 바라지는 않고 해당 내용을 학습할 수 있는 경로라든지 방법이라도 알려주시면 감사하겠습니다. p.s. 해당 강의를 작성하신 기능들을 학습하신 루트가 궁금한데 이것에 대한 답변도 주시면 감사하겠습니다.
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
마커 기능 질문
현재 업로드 기능에는 검색을 이용해서 위치를 등록하게 되어 있는데 지도상의 임의의 위치를 클릭했을 때 마커가 생성되면서 자신이 클릭한 위치를 등록할 수 있는 기능은 로직을 어떻게 구현하나요?
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
script 태그에 있는 클라이언트 아이디가 github에 공개되지 않도록 올리는 방법이 있을까요?
<script type="text/javascript" src="https://openapi.map.naver.com/openapi/v3/maps.js?govClientId=YOUR_CLIENT_ID"></script> 저는 공공기관에서 근무하고 있기 때문에 위 스크립트 태그를 사용했습니다. 혹시 github에 올릴 때 YOUR_CLIENT_ID 부분을 공개하고 싶지 않은데 방법이 있을까 궁금하여 여쭤봅니다.
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
웹 관련 문의
학교에서 동아리 자유탐구주제로 지도서비스를 제작하고 있는 고등학교 3학년입니다. 지도 서비스 강좌 1편, 2편 모두 청강을 했는데... 이 강의에서 배운 내용으로 만든 프로젝트를 학급 친구들에게 공유하고 싶은데 강의에서는 localhost:3000을 입력하고 웹서버에 접속하였는데 친구들이 접속할 때는 localhost:3000을 입력하면 접속이 안되어서 학교 선생님께 여쭈어 보았더니 apache라는 것과 같은 것을 이용해서 웹페이지를 만들고 거기에 올려야 다른 친구들이 제 프로젝트를 접속해서 볼 수 있다고 하는데 이것은 어떻게 해야 하나요??
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
서버접속시 오류가 발생하네요
C:\Users\ms\first_map\bin\www:14 TypeError: Cannot read property 'on' of undefined 이런오류가 나는데 이유가 있는것인지요? 무엇인가 위에서 정의를 해줘야하는것인지요? var app = require("../app"); var debug = require("debug")("first-map:server"); var http = require("http"); const mongoose = require("mongoose"); const userConfig = require("../config/userConfig.json"); let db = mongoose.collection; db.on("error", console.error); db.once("open", () => { console.log("Connected to mongo Server"); }); mongoose.connect( `mongodb+srv://jinnise21:${userConfig.pw}@firstmap.roaz5.mongodb.net/firstmap?retryWrites=true&w=majority`, { useNewUrlParser: true, useUnifiedTopology: true } );
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
지도정보 표시
사진처럼 address가 한줄로 나오지 않고 중간에서 끊기는데 코드를 잘못친것일까요???
- 미해결코로나맵 개발자와 함께하는 지도서비스 만들기 2
안녕하세요 강사님. ajax관련 질문을 남기고자 합니다.
강사님. 안녕하세요. ajax 관련 질문을 남기고자 합니다. post는 정상적으로 동작하는데 get이 제대로 동작하지 않습니다 ㅠㅠ 현재 localhost:3000/ 에서 마커가 전혀 보이지 않으며, localhost:3000/location으로 이동해야 등록된 데이터가 json형태로 브라우저에 출력되더군요 ㅠㅠ ajax는 굉장히 낯설어서 어떻게 해야할지 아예 감을 못잡고 있습니다. 라우터 문제는 아닌 것 같고, 코드도 강사님과 동일한데 무엇이 문제일까요 ㅠㅠ 아래에 소스코드 첨부드립니다. 답변 부탁드리겠습니다 ~! (ps. const data를 배열로 선언했을 때는 정상적으로 작동하고 있습니다. 또한 콘솔창에 값도 잘 찍히고 있습니다... 근데 마커를 못찍어주고 있습니다...) var mapOptions = { center: new naver.maps.LatLng(37.3595704, 127.105399), zoom: 10, }; var map = new naver.maps.Map("map", mapOptions); $.ajax({ url: "/location", type: "GET", }).done((response) => { if (response.message !== "success") return; const data = response.data; let markerList = []; let infoWindowList = []; const getClickHandler = (i) => () => { const marker = markerList[i]; const infowindow = infoWindowList[i]; if (infowindow.getMap()) { infowindow.close(); // 인포윈도우 닫기 } else { infowindow.open(map, marker); // 인포윈도우 열기 } }; const getClickMap = (i) => () => { const infowindow = infoWindowList[i]; infowindow.close(); }; for (let i in data) { const target = data[i]; const latlng = new naver.maps.LatLng(target.lat, target.lng); let marker = new naver.maps.Marker({ map: map, position: latlng, icon : { content: `<div class="marker"></div>`, anChor: new naver.maps.Point(7.5, 7.5), } }); const content = ` <div class="infowindow_wrap"> <div class="infowindow_title">${target.title}</div> <div class="infowindow_address">${target.address}</div> </div> ` const infowindow = new naver.maps.InfoWindow({ content: content, backgroundColor: "#00ff0000", borderColor: "#00ff0000", anChorSize: new naver.maps.Size(0, 0), }); markerList.push(marker); infoWindowList.push(infowindow); } for (let i = 0, ii = markerList.length; i < ii; i++) { naver.maps.Event.addListener(markerList[i], "click", getClickHandler(i)); naver.maps.Event.addListener(map, "click", getClickMap(i)); } });