Dve osnovne ideje u Redux-u

Pre nego što počnemo sa izučavanjem biblioteke Redux, upoznajmo se sa dve njene osnovne ideje. Prvu ideju, koja se tiče upravljanja stanjem, razmotrićemo na primeru običnog brojača na stejt-u u React-u:

function Counter() {
	// State
	const [count, setCount] = useState(0)

	// Action:
	function clickHandler() {
		setCount(count + 1)
	}

	// View:
	return (
		<div>
			<span>{count}</span>
			<button onClick={clickHandler}>+</button>
		</div>
	)
}

U ovom kodu vidimo stejt za promenljivu count - to je izvor istine za brojač. Zatim vidimo akciju (action) - događaj, koji na klik korisnika izaziva ažuriranje stejt-a. I, na kraju, prikaz (view), pomoću kog prikazujemo korisnički interfejs.

Dakle, šema je prilično jednostavna: dugme se pritisne - stejt count (State) na pritisak (Action) se menja, sledstveno menja se prikaz (View) - u našem slučaju to je broj na ekranu.

Međutim, sve će biti složenije ako imamo mnogo komponenti koje moraju da koriste jedno te isto stanje. Možemo, naravno, na primer podići stanje do roditeljskih komponenti, ali takvo rešenje ne može uvek da reši problem. Redux u ovom slučaju nudi da kreiramo jedno mesto u aplikaciji, koje bi sadržalo globalno stanje i određene šablone ponašanja pri ažuriranju tog stanja. Upravo u tome i leži prva osnovna ideja (!).

Druga ideja je povezana sa imutabilnošću, odnosno sa nepromenljivošću podataka. Vi, naravno, sećate se iz JavaScript-a da se nizovi i objekti mogu menjati. Direktno menjanje podataka u Redux-u, kao i u drugim frejmvorkovima smatra se lošim tonom i može dovesti do nepredvidivih posledica. Zato u Redux-u naši početni objekti i nizovi moraju ostati imutabilni, a menjati možemo samo njihove kopije.

Objasnite u čemu leži prva osnovna ideja Redux-a.

Objasnite u čemu leži druga osnovna ideja Redux-a.