할수있다!긍정왕

저번에 다운받은 파일 안에 getting -started 안에 index파일 입니다.

message 부분을 변경해 보았습니다.

변경한 대로 나오는 것을 보실수 있습니다.

reactivity 데이터 변경에 따라 화면도 바뀌는 것을 볼 수 있습니다.

vue-way.html 파일 생성

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty

개발자 도구을 실행시켜서 해보기

개발자 도구에서 확인

chrome 설치 : https://www.google.com/intl/ko/chrome/

visual studio code설치 : https://code.visualstudio.com/

node.js 설치 (LTS) : https://nodejs.org/ko/

vue.js dev tools  : https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd

/****************************************************************************************************************************/

https://github.com/joshua1988/learn-vue-js

/****************************************************************************************************************************/

visual Studio Code 실행

github자료를 다운 받은 후 오픈 하기 file open 

vetur  설치

material Icon Theme 설치

Night Owl 설치

live Server 설치

원하는 파일을 클릭 후 오른쪽을 클릭하여 Open with Live Server를 누르면 OK --> 파일 실행

/****************************************************************************************************************************/

뷰 개잘자 도구소개 및 실행 방법

windows + F12 : 개발자 도구 단축키

/* ************************************************************************************************************************* */

Vue 는 무엇인가?

MVVM 패턴의 뷰모델 레이어에 해당하는 화면단 라이브러리

/***************************************************************************************************************************/

auto close tag를 다운 받으시면 저절로 코드가 닫을 수 있게 불러옴

! + tab 버튼을 누르시면 필요한 html이 나옵니다.

패널 토글 단축키 : ctrl + \

이렇게 변합니다.

이렇게 결과가 나오는 것을 볼수 있습니다.

데이터를 재설정해도 화면이 바뀌지 않는 것을 볼수 있습니다.