タグ

reduxに関するkk42のブックマーク (3)

  • TwitterやSlackのRedux Storeを覗く

    { domainData1 : {}, domainData2 : {}, appState1 : {}, appState2 : {}, ui : { uiState1 : {}, uiState2 : {}, } } ref: Basic Reducer Structure and State Shape · Redux 正規化 Recipesでは正規化についても言及しており、リレーショナルデータを管理する場合はデータベースのように正規化することを推奨していました。 以下は投稿が複数のコメントを持つ例です。postsはcommentsのidだけを持っています。 { posts : { byId : { "post1" : { id : "post1", author : "user1", body : "......", comments : ["comment1", "comment

    TwitterやSlackのRedux Storeを覗く
    kk42
    kk42 2019/12/21
  • useEffect完全ガイド

    あなたは Hooks を使って複数のコンポーネントを書きました。ちょっとしたアプリも作ったことがあるでしょう。満足もしている。API にも慣れて、その過程でコツも掴んできました。しかも重複したロジックを転用できるよう Custom Hooks を作り、同僚に自慢して見たり。 でも useEffect を使う度、いまいちピンときません。class のライフサイクルとは似ているけど、何かが違う。そしていろんな疑問を抱き始めます。 🤔 componentDidMount を useEffect で再現する方法は? 🤔 useEffect 内で正確に非同期処理を行う方法とは? []ってなに? 🤔 関数をエフェクトの依存関係として記すべき? 🤔 非同期処理の無限ループがたまに起こるのはなぜ? 🤔 古い state か props がエフェクト内にたまに入るのはなぜ? 私も Hooks を使

  • Re-ducksパターン:React + Redux のディレクトリ構成ベストプラクティス

    Re-ducks というディレクトリ構成のベストプラクティスについてまとめる。Re-ducksパターンを使うことで、React + Redux を用いた開発がよりメンテナンスしやすいものになる。 Ducks パターン 名前からもわかるように、Re-ducks は Ducks というパターンをベースにしている。 erikras/ducks-modular-redux Ducks パターンが解決すること: actionType、action、reducerが散らばっててつらい 結局のところ actionType、action、reducer は密結合なので、ducksパターンではこれら3つを1つのファイルにまとめる。 // widget.js // Actions const LOAD = 'my-app/widgets/LOAD'; const CREATE = 'my-app/widget

    Re-ducksパターン:React + Redux のディレクトリ構成ベストプラクティス
  • 1