* NgRx
- Angular에서 반응형 애플리케이션을 구축하기 위한 프레임워크
- 로컬 상태관리에 용이함.
- Angular 라우터와 통합.
- 다양한 형태의 데이터, Entity 수집관리.
State
- Store - Redux에서 영감을 받은 Angular 앱을 위한 RxJS 기반 글로벌 상태 관리.
- Effects - @ngrx/store에 대한 Model.
- Router Store - Angular 라우터를 @ngrx/store에 연결하기 위한 Bindings.
- Entity - record collections을 관리하기 위한 어댑터.
- ComponentStore - 로컬/컴포넌트 상태를 관리하기 위한 독립 실행형 라이브러리.
Store 에 대해서 자세히 궁금하다면?
Angular - ngrx in State (1) Store
* why use Store? 사용하는 이유? - 상태관리를 제공 언제 사용해야될까? 사용자 상호작용이 많고 여러 데이터 소스를 공유할때 외부 저장소에서 유지될때 다른소스의 작업에 영향을 받을때 단점? -
haneui.tistory.com
Effects 에 대해서 자세히 궁금하다면?
Angular - ngrx in State (2) Effects
효과는 구성 요소에서 부작용을 분리하여 상태를 선택하고 작업을 발송 RxJS를 기반으로 구현되어 있으며, Observable을 반환한다 Effects는 Store 에서 발송된 모든 작업 의 observable을 수신 서비스
haneui.tistory.com
나머지 State에 대해 궁금하다면?
Angular - ngrx in State (3) router-store&Entity& component-store
router-store - Router를 Store 와 연결 import { StoreRouterConnectingModule, routerReducer } from '@ngrx/router-store'; import { AppComponent } from './app.component'; @NgModule({ imports: [ BrowserModule, StoreModule.forRoot({ router: routerReducer, })
haneui.tistory.com
Data
- 단순한 데이터 관리를 하기위한 Extension.
- 엔터티 유형에 대한 생성을 자동화.
- 여러 유형의 여러 엔터티를 트랜잭션 방식으로 저장할 수 있음.
View
- Component - 반응형 Angular 템플릿을 빌드하기 위한 Extension.
- Observable의 현재 상태에 따라 다른 콘텐츠를 표시.
Develop Tools
- Store Devtools - 상태 및 시간 이동 디버깅을 추적할 수 있는 @ngrx/store용 도구.
- Schematics - NgRx 라이브러리를 사용하는 Angular 애플리케이션용 라이브러리.
- ESLint Plugin - ESLint 규칙. 일관된 스타일을 적용.
'Angular' 카테고리의 다른 글
| Angular - 타입스크립트의 장점 (0) | 2023.03.20 |
|---|---|
| Angular 란? (0) | 2023.03.14 |
| Angular - ngrx in State (3) router-store&Entity& component-store (0) | 2023.03.08 |
| Angular - ngrx in State (2) Effects (0) | 2023.03.08 |
| Angular - ngrx in State (1) Store (0) | 2023.03.07 |