Angularでngrx shematicsを使う

ngrx schematicsを使う

ngrxとは

Reduxに影響を受けたAngular用のstate manager

ngrxを使う理由

個人的に3つのどれかが該当すれば、というより基本的にngrx使うことが多い。Angularを導入するプロジェクトに小規模のものがないと思ってるから。

基本的には以下3つが基準だとおもってます。

• component間の継承が多い(@Input()や@Output()など)
• componentが肥大化してしまっている
• service loginがcomponentにまで影響を与えている

schematicsを使う理由

ng XXXコマンドでfileの作成と雛形を作成する便利さと、
directory構成、file構成に秩序をschematicsによってもたらしてくれる。

Schematicsを使う

angular projectの作成

$ ng new <my-project> --style=scss
$ cd <my-project>
$ npm install

Angularのプロジェクトの作成とdefault styleをscssに設定。

ngrx schematicsを導入する

$ cd <my-project>
$ npm install @ngrx/schematics --save-dev
$ npm install @ngrx/{store,effects,entity,store-devtools} --save
$ ng config cli.defaultCollection @ngrx/schematics

上記により依存関係のpackageのインストールと、schematicsコマンドを使うことができるようになります。

schematicsコマンドを使う

$ ng generate @ngrx/schematics:feature App --root --module app.module.ts

基本的には
ng generate @ngrx/schematics:[schematics] [Name] --module [ModuleName]
でschematicsを使えます。

参考

そんな感じです。
基本的には:feature -g をよく使います。
schematicsは以下、

• Action
• Container
• Effect
• Entity
• Feature
• Reducer
• Store