1. 개요

이 문서에서는 AngularJS와 Angular의 특징을 알아보고 비교해보고자 한다.

2. AngularJS

• 구글 개발
• MVC 프레임워크 기반
• 2010년 발표
• 처리 흐름적인 측면에서 jQuery 등의 DOM 제어 방식과 차이점이 있다. DOM 선택 후 작업을 하는 것이 아니라, 일단 데이터 작업을 한 후 DOM 영역의 업데이트를 수행하는 방식이다.
• AngularJS 1.x 는 서버 렌더링 불가
• 부트스트래퍼가 하는 일
  1) 새로운 인젝터(Injector)를 생성
  2) DOM을 형식화하는 디렉티브(directive)를 컴파일
  3) 모든 디렉티브들을 스코프(scope)로 링크

3. Angular

3-1. 특징

• AngularJS 2.x 이후가 Angular 라고 보면 됨
• TypeScript 도입
• AngularJS에 대한 하위 호환성 없음
• AngularJS와 달리 scope라는 개념이 없으며 controller도 없음
• 2014년 ng 컨퍼런스에서 처음 소개됨
• Angular 2 버전 : 2014년
• Angular 4 버전 : 2016년 (다시 완전 새로운 프레임워크는 아니고 Angular 2와 하위호환됨)
• Angular 5 버전 : 2017년
• Angular 6 버전 : 2018년
• AngularJS가 모듈 수준이라면 Angular는 프레임워크 수준으로 진화
• Angular CLI 제공

3-2. 장점

• TypeScript가 도입됨
• Angular CLI를 통한 개발 환경
• 성능 향상

4. TypeScript

마이크로소프트에서 개발한 자바 스크립트의 Superset이다. 대규모 애플리케이션 개발이 목적이다.

.ts 확장자를 가지고 있지만 최종적으로는 자바스크립트로 컴파일된다. (*.ts -> *.js) MS에서 개발한 후 확산되었고 Angular(=AngularJS 2.0)에서는 공식 언어로 지정되었다. 객체 지향 언어로 C++, C#과 유사하다고 할 수 있다.

CoffeeScript와 유사하다고 할 수 있지만 CoffeeScript와 달리 자바스크립트의 문법도 사용할 수 있다는 점이 있다. 물론 TypeScript는 자바스크립트의 단점이 보완되었다.

특징으로는 interface, class, generics, module 등을 지원한다.

5. React, Vue와의 관계

Angular는 MVC 기반의 프레임워크이지만 React, Vue.js는 View 단을 다루는 자바스크립트 라이브러리다. 

공통적인 특징으로는 가상 DOM, 서버 사이드 렌더링, 라우터/번들러/상태관리자와의 결합이 용이하다, 정도이다.

React와 Vue를 비교하면 다음과 같은 차이가 있다.

• React : 보다 더 큰 규모, 웹와 네이티브 모두 개발, 생태계가 더 크다. 레퍼런스 : 에어비앤비, 넷플릭스, 트위터, 드랍박스 등
• Vue : 간편한 문법과 프로젝트 설정, 더 작은 용량