Základní terminologie v Reduxu

V této lekci si stručně projdeme základní pojmy a terminologii, jejichž znalost je nezbytná pro další studium Reduxu.

Začneme akcí (action). To je určitá událost, která popisuje, co se stalo v naší aplikaci. Technicky jde o běžný JavaScript objekt, obsahující pole type, do kterého zapisujeme název akce.

Druhým důležitým polem objektu s akcí je pole payload. Bude obsahovat užitečné datové zatížení akce. Pod užitečným zatížením se rozumí nějaká data, která jsou předávána jako parametry akce.

V tomto objektu také mohou být další pole s doplňujícími informacemi.

Vytvořme pro příklad akci a pojmenujme ji addOrderAction. Nechť odpovídá za přidání objednávky. To znamená, že ve vlastnosti type uvedeme, že objednávka byla přidána (orderAdded) do objednávek (orders). A v payload uvedeme podrobněji, co je objednávka, například - vymalovat zeď:

const addOrderAction = {
	type: 'orders/orderAdded',
	payload: 'Paint a wall'
}

Abychom nemuseli pokaždé psát objekt s akcí ručně, můžeme použít tzv. action creator - funkci, která bude vytvářet a vracet nám objekt s akcí. Pojmenujme ji addOrder. Jako parametr jí budeme předávat požadovaný text pro vlastnost payload:

const addOrder = text => {
	return {
		type: 'orders/orderAdded',
		payload: text
	}
}

Další důležitý pojem v řetězci je reducer (reduktor) - funkce, která přijímá aktuální stav a objekt s akcí. Tato funkce rozhoduje, jak aktualizovat stav a vrací již aktualizovaný stav, pokud je to nutné.

Další pojem - úložiště (store) - je objekt, ve kterém je uložen aktuální globální stav Redux aplikace. Tento objekt má metodu getState, pomocí které lze získat aktuální hodnotu stavu.

Úložiště má také metodu dispatch. Jeho zavolání a předání objektu s akcí - to je jediný způsob, jak změnit stav. Výsledkem je, že úložiště spustí funkci-reduktor a uloží si novou hodnotu stavu.

A poslední pojem, který si v této lekci prohlédneme - to jsou selektory. Selektory jsou speciální funkce, které vědí, jak extrahovat informace ze stavu uloženého v úložišti. Tyto funkce jsou obzvláště užitečné při rozrůstání aplikace a pomáhají předcházet opakování kódu.

Podrobněji o všech těchto pojmech a o jejich praktickém použití se dozvíme v následujících sekcích této učebnice.