Vue 란? (Vue / React 차이점)

 

 

Vue 공부를 시작하며

 

먼저 Vue 란 무엇인지에 대해서 알아보고 React와의 차이점에 대해서도 알아보자

 

 

 

[ 참고 블로그 ]

 

https://80000coding.oopy.io/f27f6183-0523-43e1-ab90-8f8175bd4a88

React와 Vue의 장단점 비교

 

 

 

---

 

 

1. Vue 란?

 

Vue(Vue.js) 란 웹 애플리케이션의 사용자 인터페이스를 만들기 위해 사용하는 오픈 소스 프로그레시브 JS 프로임워크이다.

 

JS 라이브러리를 사용하는 웹 애플리케이션 프로젝트에 Vue를 도입하기 쉬운데, Vue 자체가 이러한 프로젝트에 사용하기 편하게 설계되어 있기 때문이다

 

 

 

[ 장점 ]

 

(1) 양방향 데이터 바인딩 방식을 이요한다. 화면에 표시되는 값과 프레임워크 모델 테이터 값이 동기화 되어 한쪽을 변경하면 다른 한쪽도 변경된다작하며

 

(2) 컴포넌트 기반 프레임워크로 가상 DOM 랜더링 방식을 사용한다. 화면 전체를 다시 그리지 않고 프레임워크에서 정의한 방식에 따라 화면이 갱신되므로 유지보수와 재사용성이 높다

 

(3) HTML, CSS, JS만 알고 있어도 사용이 가능하기에 배우기 쉽다

 

(4) 로딩속도가 빠르다

 

 

[ 단점]

 

(1) 테스트가 어렵고, 재 구조화가 쉽지않다

 

(2) 모바일 지원 부족

 

(3) 커뮤니티 자료가 React에 비해 상대적으로 적음

 

 

 

 

2. Vue와 React

 

 

(1) Vue - React의 공통점

 

- 가상 DOM 활용

- 반응적이고 조합 가능한 컴포넌트 제공

- 코어 라이브러리에만 집중하고 있고 라우팅, 전역 상태를 관리하는 라이브러리가 존재

 

 

 

(2) Vue - React 차이점

 

- React는 단방향 데이터 바인딩 이지만 Vue 양방향 데이터 바인딩

- 리액트는 JavaScript XMl 형태로 코드를 작성하여 JS만을 사용해 UI 로직과 DOM을 구현하지만 Vue는 HTML, CSS, JS 모두 사용 가능

- Vue의 가상 DOM구현이 React에 비해 빠르며 오버 헤드가 적게 발생

- React에서 모든 컴포넌트는 JavaScript XML의 툴을 이용하기에 Vue의 템플릿 보다 진보된 기능 사용 가능

- Vue 템플릿을 사용하면 React에 비해 쉽고 빠르게 제작가능하며, 배움의 진입장벽이 낮음

 

 

 

 

3. 정리

 

React는 확장성이 좋고 커스터마이징, 자유도가 높기에 큰프로젝트에 용이하지만, JS 문법에 능숙해야하며, 진입장벽이 높은 편이다.

반면 Vue는 Vue 에서 제공하는 html 템플릿이 존재하며, 코드의 통일성을 가져가기에 프로젝트를 빠르게 만들 수 있어 소규모 프로젝트에 적합하다.