Vue

Vue
Vue란?01
Vue 특징02
Vue와 타 프레임워크간의 차이점03
Vue 활용04

Vue 특징
- 데이터 바인딩과 화면 단위를 컴포넌트 형태로 제공(MVVM)
- 2 way data bindings 제공
- component간 통신은 React와 같은 부모 자식 구조
- 다른 프레임워크와 비교했을때 훨씬 가볍고 빠름
- 쉽게 접근 가능

Vue
기존 HTML파일에 추가하는 방법
- <script> 태그에 vue.JS를 추가 신규 프로젝트를 생성하는 방법
기존 프로젝트 신규 프로젝트

Vue
Vue CLI
요구조건
- Node.js 4.x이상
shell에 해당 명령어를 입력
- npm install -g vue-cli
- vue init <template-name> <project-name>
ex) vue init webpack kw_mr_project
⇒ 프로젝트 생성 완료
template 종류
- browserify
- browserify-simple
- simple
- webpack
- webpack-simple
프로젝트 생성시 구성되는 파일들

Vue 활용
Vue Instance Lifecycle
- 데이터 관찰
- 템플릿 컴파일
- DOM에 객체 연결
- 데이터 변경시 DOM 업데이트
커스텀 로직을 추가할 경우
Vue Component
html script
전역 / 지역 컴포넌트

Vue 활용
부모 자식간의 컴포넌트 관계
html
javascript
부모 컴포넌트
자식 컴포넌트
browser

출처
- https://dzone.com/articles/react-vs-angular-vs-vuejs-a-complete-comparison-gu
- https://joshua1988.github.io/web-development/translation/why-we-moved-from-
angular2-to-vuejs/
- https://vue.js.org

Vue

More Related Content

Similar to Vue (20)

More from Wonjun Hwang (20)

Vue