Vue.js 란?

들어가기

3~4년전 Anuglar1이 나왔을때 한번 프로젝트에 적용하기 위해 공부했었던 적이 있다. 당시 Angular의 신박한 기능은 매력적이었지만, 한글 이슈등 다양한 문제점이 있어서 포기하고, 그냥 jsp + jquery 로 개발한 기억이 난다.

요즘 다시 프론트엔드에 대한 관심이 생겨 이것저것 찾아보던중 Vue.js 라는 프론트엔드 프레임워크가 있어서 공부하는중이다.

그래서 Vue.js는 머냐?

Vue.js로고


Vue.js란?

Vue.js는 Anuglar, React와 같이 웹 페이지 화면을 개발하기 위한 프론트엔드 MVVM 프레임워크 중 하나이다. 여기저기 찾아보니 Vue는 프레임워크가 아니라 라이브러리라는 말도 있다.

뷰 코어 라이브러리는 화면단 데이터 표현에 관한 기능들을 중점적으로 지원하지만 프레임워크의 기능인 라우터, 상태 관리, 테스팅 등을 쉽게 결합할 수 있는 형태로도 제공된다.

따라서 구조상은 몰라도 기능상은 프레임워크의 기능을 하고 있는거 같기에 프레임워크가 맞다고 개인적으로 생각한다.


Vue의 장점

1.일단 쉽단다.

프론트엔드의 대표적인 프레임워크인 Angular, React에 비해 쉽다고 한다. angualr는 타입스크립트(TypeScript), ES6(ECMAScript 2015)에 대한 지식이 필요하다. react또한 ES6와 JSX라는 리액트 전용 탬플릿 작성 언어를 알아야 한다. Vue.js는 HTML, javascript, CSS 정도를 알면 배워볼만 하다.(물론 웹에 대한 지식이 필요하다.) 쉬운것은 항상 옳다고 본다.

2.타 프레임워크에 비해 성능면에서 빠르다.

뷰 제작팀에서 리액트와 앵귤러를 가지고 같은 테스트 케이스(test case)에서 성능을 비교한 결과 뷰가 가장 빨랐다고 한다. (뷰 제작팀이 진행한 테스트라 별로 신빙성은 안가지만...)

Vue.js 2버전 부터 스냅돔(snabbdom)기반의 가상돔을 통해 빠른 속도로 문서를 렌더링 하며, 메모리 소비 효율도가 최대 2~3배 정도 나온다고 하니 근거가 전혀 없는 것은 아닌것 같다.

3. 리액트의 장점과 앵귤러의 장점을 갖는다.

앵귤러의 데이터 바인딩과 리액트의 가상돔(Vitual DOM) 기반 렌더링의 특징을 모두 가지고 있다. 따라서 앵귤러, 리액트보다 쉽지만 기능상 뒤쳐지지 않는다.

4.Vue.js 공식 페이지에서 재공하는 한글문서

vue.js 공식페이지의 한글화가 잘 되어있어서, 별도의 책을 구입하지 않아도 공부하는데 용이 하다.

Vue.js 공식 홈페이지 가이드 문서


Vue.js의 단점

1.규모가 큰 웹 어플리케이션 구현이 어렵다.

2.react.js 보다 생태계가 작다.