Redux Basic tutorial on the hand

Copy Basics | Redux by the hand.

Note

• pure functionは副作用を持たない関数
• typeはシリアライズ出来るものを推奨してるのでSymbolはダメそう?
• Reducerの名詞とも動詞ともいえない命名規則は combineReducers のため
  • todosとかvisibilityFilterが何を受け取り何を返すのか関数名から分からない
  • reducesの中にいるというコンテキストがあって少しだけ意味を省略できてるけど。。
• rackt/react-reduxのAPIはどうみても変
  • 使わないほうがよさそう
  • egghead.io_redux_course_notes/18-Extracting_Container_Components_(VisibileTodoList_&_AddTodo).md at master · tayiorbeii/egghead.io_redux_course_notes
  • 普通にsubscribe and unsubscribeしたほうがわかりやすさがある。
  • flux-utilsのContainerの方がよく隠せてる

  componentDidMount() {
    this.unsubscribe = store.subscribe(() =>
      this.forceUpdate()
    );
  }

  componentWillUnmount() {
    this.unsubscribe();
  }

• Reducersの合成は型がないと厳しそう
• Getting Started with Redux - Course by @dan_abramov @eggheadioは面白かった
  • Basics | Reduxをなぞった内容だった
  • チュートリアルという名前なのにリファクタリングとかやってて混乱するので、動画を見たほうが良い
  • Getting Started with Redux - Course by @dan_abramov @eggheadioの"Redux: Implementing combineReducers() from Scratch"あたりまでで一区切り
  • それ以降はReactのチュートリアルとして見たほうが良さそう
    • Reactのリファクタリングを学べる感じ
    • Redux+Reactからreact-reduxにリファクタリングしていくけど、どんどん読みにくくなる感じ
  • ReactのContextがunstableだから別の方法...みたいな話は何か危ない感じになってた
  • 動画自体は聞きやすいし書き起こしあるので面白い
  • 字幕補助: Greasemonkey script egghead: floting transcript
• Reduxはデータが中心な気がする
  • APIが複雑(省略出来ることによる複雑)なのでデータがどこからきてるのかが、コード上で追うのが難しい感じがする
  • 読みやすいコードという設計ではないのかも
• Reactじゃなくてdekujs/dekuでもいいのではとかおもった

E2Eテスト

TestCafeを使った。

npm start &
npm test