Angular

박성원·2020년 12월 1일
0

Angular

목록 보기
1/11

JS Framework 비교

Angular 구성 요소

  • component : @Compnent장식자 + component클래스
  • template : 화면 구성 역할을 담당하고 html로 작성
  • directive : template의 html태그 내의 속성 핸들링
  • service : 컴포넌트가 공통적으로 사용되는 비즈니스 로직 처리 담당
  • module : 각 구성요소 관리 (Component, Service, Directive 등)

1. Component

component는 html과 css 및 다양한 자바스크립트 코드로 구성
component클래스 안에서 화면을 동적으로 처리하기 위한 속성 및 메서드를 사용

2. Template

template는 view를 정의한다.
html를 통해서 angular에게 component를 rending하는 방법을 알려준다.
html코드 안에는 필요시 Anular표현식 (directive)이 사용된다.

3. Directive

Angular가 렌더링 될 때 directive가 제시하는 지침에 따라서 template의 DOM이 동적으로 변경된다.
Custom directive는 @Directive가 있는 클래스로서 필요시 생성이 가능하다.

Structural directive와 Attribute directive가 제공된다. (나중에 다시 확인)

4. Service

여러 컴포넌트에서 사용하는 공통적인 기능 및 데이터 필요시 서비스를 사용한다.
일반적으로 @Injectable 사용하여 서비스 클래스를 생성한다.

5. Dependency Injection( 의존성 주입, DI)

특정 인스턴스가 외부에서 필요한 인스턴스를 주입 받는 방법을 의미.
대부분 외부에서 주입 받는 인스턴스는 service이다.
즉 Angular는 새로운 component에 필요한 service를 제공하기 위하여 DI를 사용하고
생성자(constructor)를 사용하여 주입된다.

6. Module

Angular 어플리케이션에는 적어도 하나의 모듈 클래스인 root 모듈(bootstrap모듈)이 있다.
일반적으로 AppModule 이라고 부른다.
대부분의 응용 프로그램에서는 root 모듈 이외의 여러 가지 기능을 포함하는
기능 모듈이 존재한다.
모듈은 @NgModule로 설정한다.

profile
개발 일기장

0개의 댓글