---

Vue.js란

• 사용자 인터페이스를 만들기 위한 프로그래시브 프레임워크
  프로그래시브 프레임워크 :
  애플리케이션의 규모와 상관없이 어떠한 경우에도 단계적으로 유연한 적용이 가능
  
• MVVM 패턴의 뷰 모델 레이어에 해당하는 화면단 라이브러리
  MVVM 패턴 :
  모델, 뷰, 뷰모델로 이루어진 패턴
  데이터의 변화를 라이브러리에서 감지해서 화면에 그려주는 반응형을 지원
  EX) MVC
  

---

역사

2013년, 에반유(Evan You)가 시작한 개인 프로젝트로 출발

• 2014년 2월 V0.8이 정식발표
• 2015년 5월에 PHP웹 애플리케이션 프레임워크인 라라벨에 표준 탑재된 것을 계기로 라라벨 커뮤니티에서 화제
• 2015년 10월 V1.0
• 2016년 10월 V2.0

---

특징

• 이벤트 발생 시 Dom Listener가 이벤트를 잡아내어 자바스크립트의 이벤트를 변경해줌
  EX) 키보드 입력, 마우스 클릭 등
  

• 이벤트가 변경되면 데이터 바인딩를 이용해 자바스크립트의 데이터가 변경되고, 화면까지 동시에 반영
  Data Bindings :
  Vue.js의 binding expressions을 사용해 script와 DOM 간 데이터를 주고받는 과정
  

• Angular에서 지원하는 양방향 데이터 바인딩을 동일하게 제공하며, 컴포넌트 간 통신의 기본 골격은 React의 단방향 데이터 흐름(부모->자식)이다.

• 다른 프런트엔드 프레임워크(Angular, React)와 비교했을 때 상대적으로 가볍고 빠르다.

  추가 개념 - 바인딩의 종류

  단방향 바인딩
  : 상위컴포넌트에서 하위컴포넌트로 데이터가 전달되는 방식

  양방향 바인딩
  : 화면에 표시되는 값과 프레임워크의 모델 데이터 값이 동기화되어 한 쪽이 변경되면 다른 한 쪽도 자동으로 변경됨

---

장점

• 학습곡선이 낮음

• Vue는 컴포넌트 기반의 프레임워크
  컴포넌트 기반:
  DOM을 작은 단위로 쪼개어 개발하는 방식
  유지보수와 재사용성이 높음
  

• MVVM 패턴으로 기존 jQuery를 통한 DOM조작이 더 이상 필요하지 않음

• Anqular의 장점인 양방향 데이터 바인딩과 React 장점인 가상돔 기반 렌더링 특징을 모두 가짐