본문으로 건너뛰기
Advertisement

Angular 기초

Angular는 구글에서 개발한 엔터프라이즈급 웹 어플리케이션을 위한 강력한 프레임워크입니다.

1. Angular의 철학​

  • 전체 통합형 (Full-featured): 라우팅, 폼 관리, HTTP 통신 등이 모두 프레임워크 내에 포함되어 있습니다.
  • TypeScript 기반: 처음부터 타입스크립트를 기본으로 설계되어 대규모 프로젝트에서 안정성이 높습니다.
  • 의존성 주입 (DI): 코드의 결합도를 낮추고 테스트를 용이하게 하는 DI 시스템이 강력합니다.

2. 컴포넌트 예제​

Angular는 HTML, CSS, TypeScript 코드를 분리하거나 함께 작성할 수 있습니다.

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  standalone: true,
  template: `
    <h1>Hello from {{ name }}!</h1>
    <button (click)="clickMe()">클릭하세요</button>
  `
})
export class AppComponent {
  name = 'Angular';
  
  clickMe() {
    alert('반갑습니다!');
  }
}

3. RxJS와 비동기 스트림​

Angular는 데이터의 흐름을 스트림(Stream)으로 관리하는 RxJS 라이브러리를 깊게 활용합니다. 이를 통해 복잡한 비동기 로직을 선언적으로 처리합니다.

4. Angular의 특징​

  • 양방향 데이터 바인딩: 모델과 뷰 사이의 데이터 동기화가 자동으로 이루어집니다.
  • 강력한 CLI: 프로젝트 생성, 빌드, 테스트 등을 위한 명령어 도구가 매우 우수합니다.

대규모 협업 프로젝트나 체계적인 구조가 필요한 앱이라면 Angular를 고려해보세요.

Advertisement
Advertisement