ReactJS vs Angular5 vs Vue.js — What to choose in 2018?
얼마전에 우리는 Angular2와 React를 비교하는 기사를 썼습니다. 해당 기사에서 우리는 이 프레임워크들의 장점과 단점에 대해 작성하였고 2017년에 특정 목적을 위해 어떤 프레임워크를 써야할지 제안했었습니다.그렇다면 2018년 프론트엔드 영역의 상황은 어떠할까요?
자바스크립트 프레임워크는 매우 빠른 속도로 발전하고 있습니다. 그 말은 오늘날 우리는 Angluar, ReactJS 그리고 프론트엔드 시장의 다른 프레임워크인 Vue.js 의 잦은 업데이트가 있다는 말이기도 합니다. 전통적으로, 지난 5년간의 Google 트렌드에서 나타난 수요를 살펴보겠습니다. 파란선, 빨간선, 노란선은 각각 Angluar, React, Vue.js를 나타냅니다.
차트에서 볼 수 있듯이 2013-2014년 동안 React와 Aungluar의 문의 수에 작은 차이가 있다는 것을 볼 수 있습니다. 그리고 단기간에 이 편차가 증가하는 것을 알 수 있습니다. 2016년 중반부터 이러한 요구들은 균형을 맞춰갔으며 React는 성장세를 타고 Angular의 수요에 가깝게 도달하였습니다. Vue.js는 아직 그렇게 인기를 끌지 못했지만 프레임워크 시장에서 조금씩 증가하며 앞으로의 성장가능성을 보여주었습니다. 작년에는 Angluar와 React가 거의 균형을 이루었으며 이는 프론트엔드 프레임워크 시장에서 가장 많이 사용되고 있음을 의미합니다.
전반적으로 React와 Angluar는 상대적으로 동일한 역학관계로 유기적으로 발전합니다. 프론트엔드 프레임워크의 앞으로의 수요에 대해 예견해보자면 Angluar가 쇠퇴하는 반면 React는 긍정적인 경향을 보이는 것을 알 수 있습니다. Vue.js는 아직 명확하지 않지만 그것이 가지고 있는 쉬운 구조에 따라 점차 성장할 것이며, 주요 프레임워크가 될 수도 있습니다.
또한 특정 프레임워크에 대한 특별 지식을 필요로 하는 전세계의 오픈포지션(해당 직업군을 말하는 듯)의 수를 분석했습니다. 해당 수치에 대한 출처는 Indeed.com이며, 60,000개 이상의 구인정보에 따라 다음과 같은 분포를 보였습니다.
해당 자료를 고려하여 모든 프론트엔드 프레임워크의 장점과 단점에 대해 공유하고, 기술 전문과들이나 엔지니어들이 개발적 요구에 대해 가장 좋은 프레임워크를 선택할 수 있도록 결정했습니다.
Angluar5 의 장점과 단점
2009년 발표된 Angluar는 자바스크립트 MVVM프레임워크로, 고도의 양방향 웹 어플리케이션을 만드는데 있어서 거의 슈퍼히어로급입니다.
Angluar5의 이점
- 향상된 RXJS, 빠른 컴파일 (3 초 이내), 새로운 HttpClient 출시와 같은 새로운 기능.
- 동료에게 묻지 않고 각각의 개발자에게 필요한 모든 정보를 얻을 수있는 상세한 설명서. 그러나 이것은 학습에 더 많은 시간을 요구.
- 발생할 수 있는 오류의 리스크를 최소화하는 앱에 대한 단일 동작을 가능하게하는 양방향 데이터 바인딩.
- 개발자가 동일한 데이터 세트를 사용하여 동일한 앱 섹션에서 개별적으로 작업 할 수있게하는 MVVM (Model-View-ViewModel)
- 일반적으로 모듈 및 모듈성이있는 구성 요소와 관련된 기능의 종속성 주입.
Angluar5의 문제점
- Angular의 첫 번째 버전에서는 구문이 복잡했지만, 그럼에도 불구하고 Angular5는 TypeScript 2.4를 사용하므로 비교적 덜 어렵습니다.
- 이전 버전에서 최신 버전으로 이전하는 동안 나타날 수있는 마이그레이션 문제.
Angular 5를 사용하는 회사 : Upwork, Freelancer, Udemy, YouTube, Paypal, Nike, Google, Telegram, Weather, iStockphoto, AWS, Crunchbase
ReactJS의 장점과 단점
ReactJS는 2013년 페이스북이 공개한 오픈소스 자바스크립트 라이브러리로 정기적으로 데이터가 변경될 수 있는 큰 웹어플리케이션 구축에 적합합니다.
ReactJS의 이점
- 배우기 쉽다. React는 구문이 간편하여 배우기 훨씬 쉽다. 엔지니어들은 HTML작성 기술만 기억하면 된다. Angular처럼 TypeScript를 깊게 공부할 필요가 없다.
- 높은 수준의 유연성과 최대의 응답성
- HTML, XHTML 또는 XML 형식의 문서를 웹 응용 프로그램의 여러 요소를 구문 분석하는 동안 웹 브라우저에서 더 잘 받아 들일 수있는 트리로 배열 할 수있게 해주는 가상 DOM (문서 객체 모델)입니다.
- ReactJS는 ES6 / 7과 결합되어 고부하 작업을 손쉽게 처리 할 수 있습니다.
- 하위 데이터 바인딩 - 이러한 종류의 데이터 흐름을 사용하면 하위 요소가 상위 데이터에 영향을 미치지 않습니다.
- 전 세계의 개발자들의 공헌에 따라 일상적인 업데이트 및 개선 사항을 많이받는 100 % 오픈 소스 자바 스크립트 라이브러리입니다.
- 사용자 측면에서 수행하는 데이터를 서버 측에서 동시에 쉽게 표현할 수 있기 때문에 절대적으로 가볍습니다.
- 버전 간 마이그레이션은 일반적으로 페이스 북이 프로세스의 대부분을 자동화하는 "codemods"를 제공하여 매우 쉽습니다.
ReactJS의 문제점
- 공식 문서가 부족합니다 - ReactJS의 초고속 개발은 적절한 문서화를 위한 자리를 남기지 않았고 많은 개발자들이 체계적 접근없이 개별적으로 기여하기 때문에 다소 혼란스럽습니다.
- React는 지침이 없기때문에 개발자가 때로는 선택의 폭이 너무 넓습니다.
- ReactJS는 MVC 프레임 워크에 사용자 인터페이스를 통합하는 방법에 대한 깊은 지식이 필요합니다.
React JS를 사용하는 회사 : Facebook, Instagram, Netflix, New York Times, Yahoo, Khan Academy, Whatsapp, Codecademy, Dropbox, Airbnb, Asana, Atlassian, Intercom, Microsoft 등
Vue.js의 장점과 단점
Vue.js는 2013년에 출시된 JavaScript 프레임워크로 적응력이 뛰어난 사용자 인터페이스 및 정교한 단일 페이지 응용 프로그램을 만드는 데 적합합니다.
Vue.js의 이점
- 권한이 부여 된 HTML. 즉, Vue.js에는 Angular와 유사한 특성이 많이 있으며 이는 다양한 구성 요소를 사용하여 HTML 블록 처리를 최적화하는 데 도움이 될 수 있습니다.
- 자세한 문서. Vue.js는 개발자를위한 학습 곡선을 고정시키고 HTML 및 JavaScript에 대한 기본 지식만을 사용하여 앱을 개발하는 데 많은 시간을 절약 할 수있는 매우 정확적인 문서를 제공합니다.
- 적응성. 디자인과 아키텍처면에서 Angular and React와 유사하기 때문에 다른 프레임 워크에서 Vue.js 로의 신속한 전환 기간을 제공합니다.
- 끝내주는 통합. Vue.js는 단일 페이지 응용 프로그램을 구축하고 응용 프로그램보다 어려운 웹 인터페이스를 구성하는 데 사용할 수 있습니다. 가장 중요한 것은 전체 시스템에 부정적인 영향을 미치지 않으면서 기존 인프라에 쉽게 통합 할 수있는 상호적인 부분이 작다는 것입니다. (객체지향적이라는 말이 아닐지.?)
- 대규모 확장. Vue.js의 단순한 구조는 추가적인 시간 투자 없이 만들 수있는 꽤 큰 재사용 가능한 템플릿을 개발하는 데 도움이 될 수 있습니다.
- 작은 크기. Vue.js는 속도와 유연성을 유지하면서 약 20KB의 무게를 가질 수 있으므로 다른 프레임 워크와 비교하여 훨씬 더 우수한 성능을 제공합니다.
Vue.js의 문제점
- 자원 부족. Vue.js는 여전히 React 또는 Angular와 비교할 때 꽤 작은 시장 점유율을 가지고 있습니다. 즉, 이 프레임워크에서 지식 공유가 아직 시작 단계에 있음을 의미합니다.
- 과도한 유연성의 위험. 경우에 따라 Vue.js는 거대한 프로젝트에 통합하는 동안 문제가있을 수 있으며 가능한 솔루션에 대한 경험이 아직 없지만 곧 제공 될 것입니다.
- 중국어 기반입니다. Vue.js가 중국어 기반이기 때문에 많은 요소와 설명이 중국어로 계속 제공됩니다. 이것은 개발의 일부 단계에서 부분적인 복잡성을 초래하지만, 점점 더 많은 자료가 영어로 번역됩니다.
Vue.js를 사용하는 회사 : Xiaomi, Alibaba, WizzAir, EuroNews, Grammarly, Gitlab and Laracasts, Adobe, Behance, Codeship, Reuters.
결론
실제 엔지니어에게는 새로운 프레임 워크에 익숙해지는 데 약간의 시간이 걸리기 때문에 선택할 프레임 워크에는 큰 차이가 없습니다. 우리 회사에서는 주로 ReactJS 및 Angular 2/4/5에서 전문 지식을 축적하지만 Vue.js도 함께 제공됩니다. 모든 프레임 워크에는 고유 한 장단점이 있습니다. 즉, 제품 개발 중에 각각의 케이스에 대해 맞는 선택을 하면 됩니다.
원문출처 : https://medium.com/@TechMagic/reactjs-vs-angular5-vs-vue-js-what-to-choose-in-2018-b91e028fa91d
++ 구글 번역 + 네이버 사전의 도움을 받아 정리해보았습니다.