0. Vue.js란 무엇인가?

# Vue.js는 웹 페이지 화면을 개발하기 위한 프런트엔트 Framework이다. 즉, 화면단의 라이브러리 이자 프레임워크이다.

​

※ 프레임워크 : 개발자들의 생산성을 높이기 위해 일정한 규칙에 따라 개발하도록 미리 구조를 정의해놓은 도구 > 틀!

※ 라이브러리 : 자주 사용되는 기능들을 모아 재활용할 수 있도록 정리한 기술 모음집 > 재활용템!

※ DOM : HTML 문서에 들어가는 요소의 정보를 담고있는 데이터 트리

​

※ 타입스크립트 (TypeScript) : 기존 자바스크립트에 엄격한 타입 체크를 도입한 언어. 앵귤러2의 표준

※ ES6 : 자바스크립트의 최신 스펙 (=ECMAScript 2015)

※ 웹팩 (Webpack) : 웹 모듈 번들러 (Web Module Bundler). 최신 프런트엔드 프레임워크에서 권고하는 필수 웹 성능 개선 도구이다.

​

# Vue.js는 UI 화면 개발 방법 중 하나인 MVVM 패턴의 뷰 모델에 해당하는 화면단 라이브러리이다.

이와 같이 분리하여 개발하는 이유는 화면의 요소를 제어하는 코드와 데이터 제어로 로직을 분리하여

코드를 더 직관적으로 이해할 수 있고, 추후 유지보수를 편하게 하기 위해서 이다.

 

MVVM 패턴이란?

 

마크업 언어나 GUI 코드를 비즈니스 로직 또는 백엔드 로직과 분리하여 개발하는 소프트웨어 디자인 패턴

즉, 화면 앞단의 화면 동작과 관련된 로직과 화면 뒷단의 데이터베이스 데이터 처리 로직을 분리하여 더 깔끔하게 코드를 구성한다는 것

​

# Vue.js는 컴포넌트 기반 프레임워크이다.

컴포넌트 기반으로 개발하는 이유는 재사용하기가 쉽기 때문이다.

​

# Vue.js

= 앵귤러의 양방향 데이터 바인딩 + 리액트의 단방향 데이터 흐름

의 장점을 모두 조합한 프레임워크이다.

​

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

※ 단방향 데이터 흐름 : 컴포넌트 간에 데이터를 전달할 때 항상 상위 컴포넌트에서 → 하위 컴포넌트 한 방향으로만 전달하는 것을 말한다.

※ NPM (Node Package Manager) : 전 세계의 자바스크립트 라이브러리를 모아놓은 공개 저장소

※ jQuery : HTML 문서의 DOM 요소에 쉽게 접근하도록 유용한 기능을 제공하는 자바스크립트 라이브러리