ひとりごと

文章の練習と自分のアウトプットのために書いていく日記です。

NgRx入門日記(1)

まだ触ってなかったの?という感じがありますが仕事でNgRxに入門するタイミングをむかえました。キャッチアップのためにメモを残していきたいと思います。(ただの日記です。)

 

現状の理解

  • 状態管理ライブラリの必要性はわかっているつもり(コンポーネント毎にプロパティ持ってそこでフロントだけで使用するデータ(状態)をもつというやり方だと、複数コンポーネントで状態を共有したい時が面倒である。あと、アプリが大きくなるほど複雑になってしまいがちである。)
  • 状態管理の処理は自前でこさえるのもありだけど、ライブラリもある(この辺詳しく語れるほどのノウハウはまだない)
  • NgRxのStoreは、Reduxに触発された、RxJSを使用したAngularアプリケーションの状態管理 

 

ワードと役割

  • component:描画する
  • action:イベントを定義する
  • reducer:イベント発火時に実行したい処理を定義する
  • store:state(フロントで描画や状態保持のためのデータ)をもつ
  • selecter:storeからstateを読み出す

それぞれの役割を限定することで可読性が上がるのでこうなっている

 

処理の流れ

  • compornentはactionを呼ぶ
  • actionはreducerを呼ぶ
  • reducerはstoreにアクセスし、stateを更新できる
  • selecterはstoreからstateを取得できる
  • compornentはselectorが引っ張ってきたデータを描画する

 

現状わからないこと

  • チュートリアルにのってる書き方しかわからない。そもそも理解不足。。
  • 変数の後ろについている「$」つける書き方あれ何?決まり?
  • ソース追えない。。なんとなくで追ってる。。
  • 今日はプロダクトのソースのselectorがよくわからなかった。。。
  • Reduxとだいたい一緒と言われてもそれ触ってないからピンとこない
  • 要約すると、概念は理解したつもりだけど、ソースが追えない、書けない状態

 

必要なこと

  • 全般的に理解が足りていないから、チュートリアルをあと3回くらいはやったほうが良さそう
  • Angularのチュートリアルもあと3回くらいはやったほうがよさそう
  • その他、Angular以外の基礎的なところを復習していきたいと最近とても思う
  • めんどくさいことを後回しにせず一個ずつやっていこう

 

まとめ

  • 必要なことをやる
  • 改めて基礎をしっかりとやっていきたい

 

追記

上記記載後NgRxのチュートリアル一通り確認してソース見たら読めなかったところわかったのでこの調子で進めていきたい。