Vue js란

-Angular, React와 함께 많이 쓰이는 오픈소스 자바스크립트 프론트엔드 프레임워크로 기벼운 크기와 직관적인 문법으로 작은규모의 프로젝트에서 많이 쓰임

Vue js를 사용하는 이유

Angluar와 비교했을 때

• Vue js보다 더 많은 기능이 있지만 초보자가 사용하기에는 어렵고 프로젝트 구성이 복잡하며 다른 프레임워크들과 비교했을 때 용량이 많이 발생한다는 단점이 있어 비교적 직관적이고 단순한 문법을 가지고 있는 Vue js가 초보자들이나 작은 프로젝트에서 진행 했을 때 더 용이하기 때문

React와 비교했을 때

• Angular와 같이 가장 인기있고 대중적인 웹 개발에 사용되는 프레임워크이지만 JSX라는 새로운 문법을 익혀야 한다는 단점 때문에 원래 JSX를 익히고 있었던 사람이 아니라면 웹 개발을 처음하는 초보자이거나 시간이 촉박한 작은 프로젝트에서는 Vue js를 사용하는게 학습 난이도가 더 낮기 때문

장점

1. 가상 DOM을 사용하여 렌더링 성능 향상

• Angular는 가상 DOM이 아닌 실제 DOM을 직접 조작하기 때문에 애플리케이션의 크기와 복잡성에 따라 렌더링 속도가 저하 될 수 있음
• 그에반해 Vue js는 React와 가장 유사한 접근 방식으로 가상 DOM을 사용하기 때문에 DOM 조작을 최소화 하여 성능을 향상시킴

2. 낮는 학습 난이도

• Vue js에서 제공하는 Template형식이 html, css, js를 기반으로 제작한 웹페이지의 구성과 유사하기 때문에 기존 html,css, js를 알고있다면 쉽게 적용이 가능
• Angular 처럼 프로젝트가 복잡하지도 않고 React처럼 문법을 아예 새로 배울 필요도 없기 때문에 학습난이도가 이 둘에 비해 낮음

3. 통합 프레임워크

• React는 전역적 상태관리를 하거나 페이지 전환을 할 때 추가적인 모듈이나 router를 사용해야 하지만 Vue js는 자체적으로 상태관리도구나 페이지 전환 기능을 포함한 다양한 도구와 공식 라이브러리를 제공하고 있음

4. 양방향 데이터 바인딩

• Vue js의 경우 양방향 데이터 바인딩을 지원하기 때문에 우리가 준비중인 프로젝트 같은 로그인, 회원가입, 커뮤니티 등의 사용자 입력 상호작용이 많은 어플리케이션에서 유용함

단점

1. 생태계의 부족

• Angular와 React에 비해 상대적으로 생태계가 부족할 수 있기 때문에 특정 기능을 구현할 때 추가 작업이 필요할 수도 있음

2. 작은 규모의 커뮤니티

• Angular와 React에 비해 커뮤니티 규모가 상대적으로 작아 지원 및 문제해결에서 불편함을 느낄 수 있고, 특정 기능에 대한 문서화가 부족할 수 있음

대표적인 Vue 라이브러리

1. Vue js Router

• Vue js 애플리케이션의 라우팅을 관리하기 위한 공식 라우터 라이브러리, 페이지 간의 전환과 URL을 기반으로 뷰를 동적으로 로딩하고 관리하는 기능을 제공, 어플리케이션의 페이지 경로를 정의하는데 사용
  2.Vuex
  -Vue js 애플리케이션의 상태 관리를 위한 공식 상태 관리 라이브러리, 애플리케이션의 모든 컴포넌트에서 전역적으로 상태를 관리하고 동기화할 수 있도록 해줌, 복잡한 애플리케이션의 상태 변화를 추적하고 조작하기가 쉬워짐, API와 통신해 데이터를 관리하는데 사용
  3.Vue jstify
• Vue js 애플리케이션에 사용자 인터페이스를 디자인하기 위해 재사용 가능한 컴포넌트와 스타일을 제공하는 머티리얼 디자인 컴포넌트 프레임워크
  4. Nuxt.js
• Vue js 애플리케이션을 위한 프레임워크, 서버 사이드 렌더링(SSR)과 코드 스플리팅을 지원하여 SEO에 우수하고 더 빠른 로딩 속도를 제공