And Brain said,

이번 시간엔 마커를 클릭 시 해당 숙소의 정보가 뜨도록 할 것이다. 카카오 api가 지원하는 이벤트 함수가 더럽게 말을 안 들어서 예상보다 시간이 오래 걸렸다. 이전 시간의 마커 찍는 코드부터 수정이 좀 있다. 원래는 for 문이 돌아가며 addListner로 마커 하나하나 click 이벤트가 적용이 되어 function을 실행시키는건데 더럽게 안 되서 결국 메소드를 하나 더 만들었다. 근데 저 안에서 function으로 만드는 것이랑 뭐가 차이가 있길래 안 됐던건진 모르겠다. 메소드 만들고나니 이게 더 괜찮은듯 다음 시간엔 마커에 필터링을 적용시켜보겠다. Thanks for watching, Have a nice day.

미네르바의 올빼미는 황혼녘에 날개를 편다. data 속성의 값은 화면 요소의 상태가 되는 데이터 객체이다. 템플릿 문법 Mustache 문법과 v-bind 속성이 있다. [v-bind 속성] 아이디, 클래스, 스타일 등의 HTML 속성 값에 뷰 데이터 값을 연결할 때 사용한다. 형식은 v-bind 속성으로 지정할 HTML속성 앞에 접두사로 v-bind: 를 붙여준다. v-bind 문법을 :로 간소화할 수 있다. [Mustache 문법] 뷰 인스턴스의 데이터를 HTML 태그에 연결하는 텍스트 삽입 방식이다. 다른 언어나 프레임워크에서도 사용되는 템플릿 문법이다. {{ }} 안에 자바스크립트 표현식을 쓸 수 있다. methods 속성 Vue 인스턴스의 생성자 옵션 객체에서 methods 속성으로 정의한다. ..

imageSrc에 마커로 사용하고싶은 이미지 넣기 (벡터이미지는 안 됨) imageSize로 마커사이즈 임의로 조절가능 Thanks for watching, Have a nice day..

이번 시간엔 저번 시간에 얘기한대로 Quasar를 이용하여 지도에 마커를 찍어볼 것이다. 지도는 카카오 api를 사용한다. 마커에 들어갈 데이터는 이 글을 참고하기 바란다. https://theworldaswillandidea.tistory.com/8 oracleDB를 잔뜩 담은 mybatis를 express에 넣어 보내버리기 oracledb , mybatis-mapper, express, http 기본적인 모듈들을 설치한다. app.use(express.json()) app.use(express.urlencoded({extended:true})) JSON 데이터를 post하기 위한 만반의 준비. 원래는 body-parse.. theworldaswillandidea.tistory.com 일단 데이터를 받..

Quasar는 Vue.js 기반 프레임워크다. Vue나 React를 공부할 생각이었는데 Quasar를 보자마자 첫눈에 반해버렸다. 여러분도 이 Quasar의 아름다움에 빠져보길 바란다. 일단 Quasar에게 이리오너라를 한다. 하면 고운 Quasar의 모습이 나온다. 이제 원하는대로 취향에 맞게 Quasar를 만질 수 있도록 커스터마이징을 할 수 있다. 이렇게 여러분도 Quasar 오너가 되길 바라며, Quasar야, 이리오너라! 다음 시간엔 Quasar를 이용하여 지도에 마커를 찍어볼 것이다. Thanks for watching, Have a nice day. https://quasar.dev/ Quasar Framework - Build high-performance VueJS user interfa..