Angular

Angular

FRONTEND

TypeScriptを主要言語としてGoogleが開発した包括的なフロントエンドフレームワークです。コンポーネントベースのモジュラーアーキテクチャ、ネイティブ依存性注入、リアクティブプログラミングのためのRxJS、スケーラブルでメンテナンス性の高いWebアプリケーションを構築するための堅牢なCLIを備えています。

学べること

デコレーターと高度な型(@Component、@Injectable)を備えた厳格なTypeScript

NgModulesとlazy loadingによるモジュラーアーキテクチャ

providersとscopesによる階層的依存性注入

リアクティブプログラミングのためのRxJS(Observables、Operators、Subjects)

強力なテンプレート構文(data binding、directives、pipes)

堅牢なフォーム(Template-drivenとバリデーション付きReactive Forms)

guards、resolvers、lazy loading、preloadingを備えた高度なRouter

interceptors、caching、エラーハンドリングを備えたHttpClient

リアクティブ状態管理のためのSignals(Angular 16+)

包括的なテスト(Jasmine、Karma、TestBed、mocking、CypressによるE2E)

マスターすべき重要トピック

この技術を理解し面接で成功するための最も重要な概念

1

TypeScript: decorators、高度な型、interfaces、generics

2

コンポーネント: templates、styles、lifecycle hooks、ViewChild、ContentChild

3

データバインディング: interpolation、property binding、event binding、two-way binding

4

ディレクティブ: structural(*ngIf、*ngFor、*ngSwitch)、attribute(ngClass、ngStyle)、custom

5

Pipes: built-in(date、async、json)、カスタムpipes、pure vs impure

6

サービスと依存性注入: providers、階層的DI、injection tokens

7

RxJS: Observables、Operators(map、filter、switchMap、mergeMap)、Subjects、unsubscribe

8

フォーム: Template-driven vs Reactive、FormControl、FormGroup、validators、async validators

9

ルーティング: routes、RouterLink、RouterOutlet、guards(CanActivate、CanDeactivate)、resolvers

10

HttpClient: GET/POST/PUT/DELETE、interceptors、エラーハンドリング、retry logic

11

Change Detection: strategies(Default、OnPush)、zones、手動トリガー

12

NgModules: imports、exports、declarations、providers、lazy loading

13

Signals: signal()、computed()、effect()、リアクティブステート(Angular 16+)

14

状態管理: BehaviorSubjectを使ったServices、NgRx(Store、Effects、Selectors)

15

テスト: ユニットテスト(Jasmine、TestBed)、コンポーネントテスト、service mocking、E2E

16

パフォーマンス: OnPush、trackBy、lazy loading、preloading戦略、バンドル最適化

17

Angular CLI、ビルド設定、デプロイ、Angular UniversalによるSSR