익명의 개발노트

Vue.js는 2버전과 3버전으로 현재 나뉘고 있다. 2버전과 3버전으로 설치시 명령어가 다르다. 리액트에 create-react-app이 있다면, 뷰에는 Vue-cli가 있다. 1. 설치방법 npm i -g @vue/cli // vue-cli 3.x npm i -g vue-cli // vue-cli 2.x 2. 프로젝트 생성 vue create '프로젝트 명' // vue-cli 3.X vue init webpack '프로젝트 명' // vue-cli 2.X 3. 2버전을 설치하였다면, 프로젝트를 생성한 후 npm install를 실행해서 node_modules를 깔아주어야 하고, 3버전은 프로젝트생성시 자동으로 설치 된다. 4. 웹팩 설정파일 2버전은 노출이 되어있고, 3버전은 노출이 안되어있다. ..

1. 서로 다른 컴포넌트끼리 값 직접 참조할 수 없다. 2. 컴포넌트 안에서 Vue인스턴스가 상위 컴포넌트가 된다. 3. 상위컴포넌트에서 하위컴포넌트로 데이터 전달시 props로 전달 가능하며, 하위에서 상위로 데이터 전달시 이벤트 버스를 사용한다. 4. 이벤트를 발생시키는 쪽에서는 $emit('이벤트명') , 받는쪽은 v-on:으로 수신한다. 5. 같은 레벨의 컴포넌트간의 통신은 아래 그림과 같다.(부모보냈다가 부모에서 값 받아야함) 관계없는 컴포넌트 간 통신은 통상 이벤트버스를 이용해서 통신한다. 6. template 특성 1) template 대신 render 함수로 구현해도 됨. 2) 싱글 파일 컴포넌트 체계 => .vue 파일 1개는 1개의 컴포넌트와 동일 7. 데이터 바인딩 방식 1) v-on..

리액트, 앵귤러와 같이 3대장 중 하나이다. 특징은 쉽고 빠르게 그릴수 있다. 기본적으로 html, script, css 구조로 이루어져있다. 통상 MVC 패턴에서 일반적인 함수들은 Controller에 해당한다. Vue의 script부분은 기본적으로 인스턴스로 구성되고, 그안에 property로 data를 다루는 model부분과, Controller를 다루는 객체부분이 존재한다. 그밖에도 여러개의 Vue 인스턴스 속성을 가지고 있다. Vue 3부터 설치명령어가 살짝 다르다. npm install -g @vue/cli 프로젝트 시작하기 vue create my-app