프론트엔드 라이브러리를 사용해야 하는 이유?

• 프론트엔드 라이브러리를 사용하지 않을 경우 DOM API를 직접 사용해 웹을 구축해야 함

프론트엔드 라이브러리/프레임워크 인지도 순위

• React의 사용률은 2016년부터 6년 연속 가장 높은 수치를 기록하고 있음
• 만족도 측면에서는 React와 더불어 가장 많이 사용되는 프론트엔드 라이브러리인 Angular, Vue.js와 비교했을 때 가장 높은 수치를 기록하고 있음

React

• 컴포넌트 기반의 개발
  • XML 포맷의 Template을 직접 JavaScript에 내장시킨 JSX 기술을 사용하는 JavaScript에 집중된 형태의 컴포넌트
  • 손쉬운 코드 재사용이 가능
• 서드 파티(Third party) 라이브러리에 의존
  • 사용자가 자유롭게 개발에 필요한 모듈을 결정하고 선택할 수 있음
• 가상 DOM을 이용 (가상 DOM은 Vue.js에서도 사용하나?)
  • 가상 DOM 트리에 실제 DOM 트리가 Mapping되는 형태
  • 가상 DOM 내의 변경사항을 추적해 전체 트리의 다른 부분에는 영향을 주지 않고, Mapping된 실제 DOM 상의 특정 요소만 업데이트
  • 한 요소에서 변경이 발생하더라도 전체 트리 구조를 업데이트하는 전통적인 DOM 방식에 비해 렌더링 성능에서 우위를 가질 수 있음
• 단방향 데이터 바인딩
  • Model이 변경되는 경우에만 View를 변경
  • 예측 가능성이 높아 코드 구조가 안정적

Angular

• TypeScript를 사용해 정적 타입을 지원
  • 코드 어시스트, 타입 체크, 리팩토링을 지원하는 도구 사용 가능
• 컴포넌트 기반의 개발
  • 컴포넌트의 형태로 사용자 인터페이스, JavaScript 파일, HTML 파일, CSS 파일을 포함
  • 컴포넌트의 UI 부분을 HTML 태그와 속성으로, 동작 부분은 JavaScript로 분리

Vue.js