React
抑えどころ! データは親コンポーネントから子供コンポーネント常に一方向に流れる(undirectional data flow)
Propsは親子コンポーネントから子供のコンポーネントになんのデータをどんなpropsの名前で流していくか、重要なものなので
reactのexampleコードをたくさん読んで見慣れておくと最高です:)
読んで良いなと思ったコードたち(propsがいっぱいで大変ですが じ〜〜っくり読むと徐々に慣れてくると思います)
https://github.com/gakuakachi/sound-redux
https://github.com/gakuakachi/login-flow
Redux
https://egghead.io/courses/getting-started-with-redux -> reduxを作った人がreduxの説明をしてくれる動画
https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0 -> containerとcomponentについて
-Reduxのstoreのstateを更新できるのは基本的にはactionのみ
-actionとはdispatch({type: 'actionのtype', payload: '更新するためのデータ'})
-reducerでactionが受け取られ、各actiontypeに沿って、何を、どう更新するか
connectメソッド - connect(mapStateToProps, mapDispatchToProps)(Component) ReactコンポーネントでReduxstoreのstateを使えるようにする、
mapStateToProps -reduxStoreのstateをconnectしたコンポーネントに渡す(使うstateはselectorでなんのstateを使いたいか選びましょ!)
mapDispatchToProps - dispatchメソッドをconnectしたコンポーネントに渡す
Styled Component ->スタイルもコンポーネント化していきましょう的な
https://hackernoon.com/styled-components-in-action-723852f2a93d
Selector -> reduxのstateからどんなデータが欲しいか、選ぶ(各コンポーネントのselector.jsに書いてあります)
Reselect -> データーをメモ化(いちいち計算しなさなくてもいいようにできる)
https://github.com/reactjs/reselect
Immutable.js -> データそのものを書き換えるのではなく、元データと更新分を参照して、新たな値を返す
以下の関数をdocumentationでさっくり見てみてください
get getIn => selectorにてどのstateを使うかget,もしくは取りたいstateが深い場合はgetIn
set setIn => stateオブジェクト(だいたいオブジェクト)を更新するとき
merge mergeDeep => stateオブジェクト(だいたいオブジェクト)のプロパティを複数個、更新するとき
ReduxForm
Reduxのstoreを利用して、formデータの保存場所にできる。
https://redux-form.com/7.1.2/
Redux-saga
キーワード
Saga: put, call, takeLatest
ES6: generator https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Generator
promise https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Promise (edited)