Redux

参考 公式のありがたい画像 画像に出てくる各用語の解説 Store Reducer State UI Action payload Dispatch EventHandler StoreとEventHandlerの繋ぎ createAsyncThunkとは createAsyncThunkの構文 createAsyncThunkの引数 createAsyncThunkの戻り値 createSliceとは 構文 引数 戻り値 サンプルコード ちょっと分かりづらい所メモ（ActionCreatorとtype） ActionCreator reducersとextraReducersのtypeの違い…

Reduxとは 参考サイト 素のReduxコードと公式画像を照らし合わせて理解する 最初にまとめ Store Reducer State UI Action type payload Dispatch EventHandler StoreとEventHandlerの繋ぎ Reduxとは 状態を管理するライブラリ。 アプリケーション全体で状態を管理できるため、propsで渡す手間が省ける。 propsのバケツリレーを回避できる。 React以外でも使える。 参考サイト www.udemy.com redux.js.org qiita.com 素のReduxコードと公式画像を照らし合わせて理解する…

Node.jsがDenoに変わったりと最近、web界隈を支えてきたコア技術の入れ替わりが多い気がしますね。 一部界隈で、OSSの時代は終わったみたいな声がささやかれてますがその影響だったりするんだろうか。 もともと、OSSって自身のスキルを示すために開発している節があったので、そうした取り組みが破綻し始めてると考えると、web界隈の人気もしばらく低迷しそう。 webpackが開発終了 Internet Explorerへの対応する役割を完遂 webpackの開発者はturbopackへ 公式githubはまだまだ稼働していそう turbopack vs viteの争いへ 速度重視ならturbo…

（参考URL） next.js + typescript で Redux Toolkit を使う最小サンプル Getting Started with Redux（公式） Redux Toolkit TypeScript Quick Start Next.js + typescript のインストール npx create-next-app . --ts reduxtoolkitとreact-reduxのインストール yarn add @reduxjs/toolkit react-redux では、シンプルでも動く構成で作っていきます。 やることは 型と初期値を定義 slice（機能）の定義 …

まさかの落とし穴の対策。 レビューにも書いたが赤い所のM.2。風が当たらないので爆熱になる・・・ 風がないなら、起こせばいいじゃない。 って事で、使ってないサーキュレーターで応急処置。 これでいいんだけど、PCのON/OFFに連動できないので カッコ悪いが背に腹は返れないので、ケースFUNを購入。 なんでもよかったんですが、知り合いのおすすめだった NoctuaのFUNを購入。 ◆Noctua NF-P14s redux-1200 PWM 高いだけあって箱、豪勢すぎひん？ｗ 別に120㎜でよかったけど、商品の発送日の関係で140㎜にした。 だ、ださい・・・ 仮置きでグラボの上にぽんとおいてるだ…

こんにちは！ スマレジ テックファームのMichiです！ 前週に引き続き、Reactのキャッチアップをしていきます。今回は『グローバルステートの管理』について学びます。 グローバルステートの管理方法 Contextを使用する方法 外部ライブラリを使用する方法（Redux） Reduxの基本概念: ステート（State） リデューサー（Reducer） アクション（Actions） 実践 準備 ステートの利用 ステートの更新 どうやって使い分けるのか？ Contextのメリット Reduxのメリット まとめ グローバルステートの管理方法 Reactにおけるグローバルステートの管理方法は2つありま…

「たったこれだけで "ひととおり" って言うな！」というツッコミは甘んじて受けます。 触ったもの useReducer + useContext 👍 React 本体の知識だけで使える ❌ reducer に非同期処理を書けない ❌ Context が増えてきたら非常に読みづらくなる ❌ 結果的に劣化 Redux ができがちなので、よっぽど小規模でない限りわざわざ採用するメリットは無い Redux Toolkit 👍 素 Redux と比べてボイラープレートコードは減った ❌ 非同期処理の絡むコードは必ずしも読みやすくない（私見） 非同期の処理は extraReducers という所に分けて書…