개발기본/개발환경
React vs Angular vs Vue 비교하기
datajoy
2021. 6. 23. 20:39
# React vs Angular vs Vue 비교
React | Angular | Vue | |
구조 | 라이브러리 | 프레임워크 | 프레임워크 |
커뮤니티 활성화 | 1 | 2 | 3 |
러닝커브 | 중간 | 높음 | 낮음 |
생산 | 페이스북 | 구글 | 개인(Evan You 프로젝트 리더) |
Release | 2013 | 2010 | 2014 |
DOM | Virtual DOM | Real DOM | Virtual DOM |
데이터바인딩 | 단방향 | 단방향, 양방향 | 단방향, 양방향 |
html 스크립팅 방식 | JSX | Template | Template |
사용자 | Facebook, Netflix, Uber, Heroku, Paypal, Atlassian, Airbnb, Microsoft |
Google, Youtube, Aws, Telegram, Paypal, Upwork, Nike |
Nasa, Adobe, Nintendo, GitLab, Facebook, Netflix, Alibaba |
선정기준 | 빠른 일정안에 기업용 솔루션 수준의 애플리케이션을 개발할때 사용. | 기능이 풍부하고 규모가 큰 애플리케이션 개발 시 사용. 확장가능한 프래임워크가 필요 시 사용. |
시장 진입단계에서 작고 가벼운 애플리케이션 개발 시 사용. |
장점 | 유연성이 높고 가볍다 러닝커브가 높지 않아 자바스크립트 사용해본사람은 금방 사용가능. 가상돔으로 변경된 부분만 렌더링 되기 때문에 가볍고 빠르게 렌더링이 가능. 한 방향으로만 데이터가 바인딩 되기 때문에 안정적이고 디버깅이 쉽다. |
프레임워크라 유지보수성이 높고 많은 기능들이 내제되어있어 생산성이 좋다. 양방향 데이터 바인딩으로 생산성을 높임. |
Angular와 React의 장점(생산성 증가, 가상돔 사용)을 모아서 작업이 되었음. 문법이 단순하고 간결하여 러닝커브가 낮고 접근성이 높음. |
단점 | 자유도가 높아 지원 라이브러리를 선정하거나 배우는데 리소스가 소모 될 수 있다. (JSX, Redux, Babel, Webpack, React Router) 높은 자유로도 인해 엔지니어의 코드 형식이 다를수 있어서 형식맞추는 과정에서 리소스가 많이 소모 될 수 있음. |
비교적 번들 사이즈가 높아 초기 로딩속도가 느리다. 러닝커브가 높다. 해당 기술을 가진 사람 찾기가 비교적 어려움. 양방향 데이터 바인딩으로 성능이슈 발생할수있음. |
단순성과 유연성이 좋다보니 안 좋은 코드들로 인해 디버깅이 힘들어질 수 있다. 기업지원이 없음. 커뮤니티가 적음. 기업용 솔루션으로는 적합하지 않음. |
의견 | 일단, 뷰는 기업용 솔루션으로 적합하지 않다고 판단되어 제외하고 Angular는 유지보수성이나 생산성에 있어서는 장점을 갖고 있으나 러닝커브가 높아서 새로운 개발자가 학습하는데 어려움을 느낄 수 있습니다. 특히, eHR 특성상 백엔드에 치중되어 있기 때문에 전문수준의 클라이언트 개발자 채용이 어려워 학습해야하는 리소스로 인해서 비효율적이라고 판단하여 React를 선정. React의 자유도가 높아서 발생하는 단점은 초기 리소스는 많이 소모 될 수 있지만, 템플릿 구성하여 초기 셋팅을 만들어두면 리소스를 줄일수있다고 판단됨. |
# 선정하기