[propertyName] = "expression"
" " 내부에는 string이 아니라 expression(표현식)이 오는 곳이므로 주의하자.
Attribute and Property
Attribute는 HTML Element의 attribute이고 Property는 DOM node object인 HTML Element 객체의 property이다. 초기에 HTML Attribute가 초기값으로 그려지고 Property는 실시간으로 변경되는 DOM 최신값을 반영한다.
2> <input value="Initial Value" [value]="Property Value">
>
앞의 value는 attribute이고 [value]는 property이다. Property는 최신값이므로 실행시 “Property Value”가 view에 보여지게 된다.
Angular Application은 component를 중심으로 구성되는만큼 component는 Angular의 핵심 개념이다.
Component는 application의 화면을 구성하는 View를 생성하고 관리한다.
Component는 template의 중첩 관계에 의해서 tree 구조를 갖는다. 여러 component 사이의 통신과 상태 관리를 위해서 Service가 있다.
Angular는 SPA(Single Page Application) 개발을 위한 Google의 Open source JavaScript Framework.
Framework and Library
Library는 관련있는 함수를 모아놓아 개발자가 사용할 수 있는 도구이다. 즉, Library는 개발자에 의해 사용된다.
Framework는 클래스와 인터페이스의 집합으로 Application의 Flow를 쥐고 있다. 개발자가 Framework 틀 내부에서 작업하는 것이다.
전통적인 웹 개발에서 JavaScript는 HTML/CSS에 의존한다. 의존한다는 것은 HTML/CSS에 접근해서 조작하는 방식으로 JavaScript 코드가 작성되었다는 것을 뜻한다. 이는 HTML/CSS가 변경되면 JavaScript 코드도 영향을 받음을 의미한다.
Angular는 HTML/CSS가 JavaScript에 의존하도록, 즉 JavaScript 코드의 상태 데이터 (State)에 바인딩해서 상태가 변경될 때마다 Rendering되도록 한다. HTML/CSS를 JavaScript의 Rendering 함수 내부의 문자열로 관리하면 앞서 말한 동작이 가능하다.
JavaScript는 모듈 기능을 지원하지 않고, 동적 타입 언어라는 단점 때문에 대형 프로젝트를 진행하기에 불편한 점이 많았다. 따라서 JavaScript의 단점을 보완하고자 하는 AltJS(Alternative) 언어들이 출시되었다. 브라우저는 JavaScript만을 인식하므로 AltJS 를 사용하더라도 JavaScript로 Compile해야한다.
TypeScript도 AltJS 중 하나로, JavaScript의 Superset(상위 호환)이라는 특징을 가진다. TypeScript는 ES5의 Superset이므로 기존 JavaScript 문법을 그대로 사용할 수 있다. 또한 Babel 등의 Transpiler를 사용하지 않아도 ES6의 새로운 기능을 기존 브라우저에서 실행할 수 있다. TypeScript의 가장 주된 장점은 Static Type을 지원한다는 것이다.
Angular가 TypeScript를 정식 채용하고 ECMAScript의 업그레이드되는 기능을 지속적으로 추가할 예정으로 많은 주목을 받고 있다.
Update your browser to view this website correctly. Update my browser now
