🔍 데이터 바인딩이란? 바인딩이란 묶는다는 의미로, 웹 프로그래밍에서는 UI를 통해 표시하고자 하는 데이터를 실제 데이터와 연결해주는 프로세스를 의미한다. 🔍 Vue.js 데이터 바인딩 Vue.js는 대부분의 html 태그에 바인딩을 제공한다. input 태그의 text 박스에 Vue에서 정의한 inputData 데이터를 바인딩해보면 hello가 잘 들어간다. Vue.js에서 데이터를 바인딩하기 위해서는 예약어 v-bind를 사용해야 한다. (예약어는 생략 가능하다.) v-bind:속성명="데이터 또는 함수" :속성명="데이터 또는 함수" //생략 버전 input 태그의 type까지 바인딩 가능하다. 태그의 link를 바인딩하려면 아래와 같이 작성하면 된다. 함수 바인딩 실행 결과

🔍 Vue 인스턴스 뷰 인스턴스(Instance)는 Vue.js로 화면을 개발하기 위해 필수적으로 생성해야 하는 기본 단위이다. Vue 생성자는 미리 정의된 옵션으로 재사용 가능한 컴포넌트 생성자를 생성하도록 확장될 수 있다. 뷰 인스턴스 생성 시에는 데이터, 템플릿, 메소드 등의 옵션을 포함할 수 있는 options 객체를 전달해야 한다. var vm = new Vue({ //옵션 }) el (string | HTMLElement) : 대상이 되는 html element 또는 css selector (vm.el) template (string) : Vue 인스턴스의 마크업으로 사용할 문자열 템플릿 data(Object | Function) : 화면을 그리는데 사용하는 data를 반환하는 함수 or da..

회사에서 Vue.js로 작업을 하고 있어서 기초 공부를 시작했다. 뷰는 공식 문서가 굉장히 잘 정리되어 있어서 공식 문서랑 유튜브로 기본 공부를 시작하려고 한다. https://kr.vuejs.org/ Vue.js Vue.js - 프로그레시브 자바스크립트 프레임워크 kr.vuejs.org 🔍Vue 설치 방법 크롬 브라우저에 Vue Devtools 설치 직접 cdn 프로덕선 버전 CLI Vue CLI(Vue Command Line interface)는 기본 뷰 개발환경을 설정해주는 도구. VS Code 터미널 실행 후 아래 명령어로 설치. npm install -g @vue/cli +개발 툴은 VS Code 사용 예정