현재위치 버튼을 누르면 현재위치가 나타나게 하는 기능을 만든다. jQuery 라이브러리를 통해서 구현을 해본다. -jQuery란? 웹사이트에서 자바스크립트를 쉽게 사용할 수 있도록 도와주는 오픈소스 기반의 자바스크립트 라이브러리 ->클라이언트쪽의 이벤트들을 조금 더 쉽게 작성할 수 있도록 고안된 라이브러리 if ("geolocation" in navigator) { navigator.geolocation.getCurrentPosition(function(position) { const lat = position.coords.latitude; #현재위치 위도가 담긴다. const lng = position.coords.longitude; #현재위치 경도가 담긴다. const latlng = new nave..

var data = [] [] 안에서 위치정보, 콘텐츠 같은 정보들을 저장한다. { title : "seoul" content : "서울 남산타워" date : "2020-03-15" lat : 위도 lng : 경도 } 외부에 있던 데이터, data 폴더 안에 data.js를 여기 index.ejs안에서 활용을 해보겠다 라고 명시한 것이다. data라는 변수를 스크립트 안에서 사용할 수 있게 된다. data가 배열형태이기 때문에 for문을 통해서 하나씩 읽어본다. for(var i in data) { var target = data[i]; //title, content, date, lat와 lng라는 정보가 저장된다. var latlng = new naver.maps.LatLng(target.lat, t..

npm install -g nodemon -g란 ; global로 설치를 해서 다른 프로젝트 그런 경로 상관없이 모든 곳에서 nodemon 패키지를 쓸 수 있도록 해준다. nodemon이라는 패키지는 서버를 껐다 켰다하는 불편함을 해소시켜주는 패키지라고 볼 수 있다. npm install -g express -generator express는 웹 서버를 쉽게 만들 수 있는 프레임워크이다. 설치 후, 서버 띄우기 설치한 express라는 패키지를 사용해서 프로젝트를 생성해본다. express --ejs 폴더이름 cd 폴더이름 npm install ->프로젝트 내에 폴더와 파일이 생성된다. 위에서 설치한 nodemon패키지를 통해서 서버를 켠다. nodemon ./bin/www 이후 크롬 브라우저에서 loc..

기존에 지도 중심으로 지정되어 있던 네이버 그린팩토리의 위도, 경도를 이용하여 마커를 생성해본다. 다음은 CSS 배경색, 투명도, 높이, 길이 설정해주고. border-radius는 원으로 만들기 위한 것! 결과물

내가 작업하던 것들을 localhost로 부르는데 뜨지 않는다..(당황) 그럴 때는! 터미널에 sudo npm install -g nodemon cd 폴더이름 nodemon ./bin/www 다시 연결된다.

지도 위 배너에 아래와 같이 나타내려고 한다. 현재 날짜 2020.10.03 이제 CSS 입히기~ 흰색 배경 박스, 글자 중간 정렬로 나타내기 #infoBox { position: absolute; top : 100px; z-index : 10000; background : white; left : 20px; padding : 15px; border : ; border-radius: 4px; text-align : center; } 현재날짜도 Bold값으로 나타내기 #intoTitle { font-size font-weight }