[Redux]Reduxとは?

Velopertの著書『反応技術』をもとに書かれています

冗長性は、最も一般的なレスポンスステータス管理ライブラリです.構成部品のステータス更新ロジックを別のファイルに分離することで、より効率的に管理できます.
△1つの場所から集中的に管理するよりも、ファイルを分離して管理する方法が各場所で有効であるようです.
さらに、構成部品間で同じ状態を共有する必要がある場合、複数の構成部品を通過することなく、状態値を簡単に伝達または更新することができる.
reduceライブラリは、グローバルステータスを管理する際に非常に有効です.もちろん、Ridexを使用するのは唯一の解決策ではありません.同様の操作はContext APIによって実行することもできる.反応v 16.3リリース後、Context APIが改善されるまで、その使用は非常に不便であったため、主に冗長性を使用してグローバル状態管理を行った.
グローバル状態を管理するだけで、Context APIを使用すれば十分です.ただし、プロジェクトの規模が大きい場合は、ステータスをより系統的に管理できるため、製品を使用することをお勧めします.これは、コードの保守性を向上させ、生産性を最大限に向上させるためです.また、開発者ツール(ミドルウェアと呼ばれる)を非常に便利にサポートし、非同期タスクをより効率的に管理できます.
次はredusを使うときに触れるキーワードです.
1.動作

状態が変化すると、動作(action)が発生します.オブジェクトとして表現されます.アクションオブジェクトのフォーマットは次のとおりです.

{
  type: 'TOGGLE_VALUE'
}

アクションオブジェクトにはtypeフィールドが必要です.この値をアクションの名前と見なします.その他の値は、後でステータスを更新するときに参考にする値で、作者が勝手に置くことができます.
ex)

{
  type: 'ADD_TODO'
  data: {
  	id: 1,
    text: '리덕스 배우기'
  }
}

{
  type: 'CHANGE_INPUT'
  text: '안녕하세요'
}

2.動作生成関数

アクション作成関数(action creator)は、アクションオブジェクトを作成する関数です.
以前に説明したアクションがこのアクションに宣言されたオブジェクトである場合、アクション作成者はアクションを作成し、実際のオブジェクトにする関数です.

function addTodo(data) {
	return {
    	type: 'ADD_TODO'
        data
    }
}

const changeInput = text => ({
	type: 'CHANGE_INPUT'
    text
)};

変更が必要なたびにアクションオブジェクトを作成しますが、手動でアクションオブジェクトを作成するたびに面倒になり、作成中に予期せぬ情報が失われる可能性があります.このような状況を回避するために、管理のために関数として作成します.
3.掘削機

reducer(reducer)は状態を変化させる関数である.アクションを作成して起動すると、Reducerは現在の状態と入力されたアクションオブジェクトをパラメータとして受信します.次に、2つの値で新しいステータスを作成して返します.

const initialState = {
  counter: 1
};
function reducer(state = initialState, action) { // 이전값, 액션 객체
  switch (action.type) { // 액션 객체의 타입에 따라서
    case INCREMENT:
      return {
        counter: state.counter + 1;
      };
    default:
      return state; // 새로운 상태를 반환
  }
}

4.ショップ

プロジェクトにコピーを適用するストア(store)を作成します.1つのプロジェクトには1つの店しかありません.ショップには、現在のアプリケーションのステータスとリカバリプログラムが含まれています.また、重要な組み込み機能もあります.ショップはいつでもステータスをチェックし、Viewに変更を通知します.
5.派遣

Dispatchはショップの内蔵関数の一つです.派遣は「刺激的な動き」と理解できる.この関数はdispatch(action)と同じ形式で動作オブジェクトをパラメータとして呼び出します.派遣は、ショップにステータスを変更する必要があることを通知するアクションをトリガーします.
この関数を呼び出すと、ショップはリカバリプログラム関数を起動して新しいステータスを作成します.
6.購読
購読もショップの内蔵機能の一つです.リスナー関数をパラメータとしてsubscribe関数に入れて呼び出すと、ステータスが更新されるたびにリスナー関数が呼び出されます.

const listener = () => {
  console.log('상태가 업데이트됨');
}
const unscribe = store.subscribe(listener);

unscribe();

整理するとこの順番になりますActionCreatorがActionオブジェクトを作成し、Dispatchを呼び出すと、リカバリプログラム関数を実行して新しいステータスが作成されます.
キーワードを並べただけでは実感できないなぜこれらの関数が存在しなければならないのかまだ分かりません.これからは実際にRidexを使って感じてみないとわかりません