Andmevahetus Redux rakenduse ja serveri vahel

See jaotist on kogenud õpilastele, kes ei peatanud Reduxis saavutatule ja otsustasid selle õpiku lõpuni jõuda. Järgmistes kahes jaotises käsitleme Redux rakenduse tööd asünkroonse loogikaga, ühendame oma rakenduse serveripoolse osaga ja õpetame seda sellega andmeid vahetama.

Eelmistest jaotistest teame, et Redux rakenduse töö põhineb sünkroonsel mehhanismil. Peamised tööetapid seisnevad sündmuste saatmises rakenduses mingi sündmuse toimumisel, seejärel store'i oleku uuendamises redutserfunktsiooniga, rakenduse komponentide teavitamises olemu muutumisest ja vastavalt uue oleku väärtuse kuvamises komponentides.

Reaalses elus juhtub sageli nii, et rakendus vajab ka asünkroonset loogikat, näiteks HTTP API päringute töötlemisel ja andmete saamisel mõnelt väliselt serverilt. Seetõttu, et meie 'sünkroonne' Redux store saaks töötada sellise asünkroonse loogikaga, kasutatakse nn middleware'it - tarkvara, mis on vahendajaks või ühenduslüliks meie rakenduse store'i ja näiteks serveri vahel, millega me alustame tööd selles õpiku peatükis.

Reduxi jaoks on loodud palju selliseid middleware'eid, kuid nende seas kõige laiemalt levinud ja ametlikult soovitatud Reduxi rakenduste töötamisel asünkroonse loogikaga on siiani Redux Thunk. See tarkvara aitab meil kasutada tavalisi funktsioone (või thunk'e), mis võivad sisaldada endas asünkroonset loogikat, nagu setTimeout, Promises, async/await, et suhelda meie store'iga. Mis puudutab terminit ennast, thunk - on kood, mis teeb mingit edasilükatud tööd.

Nüüd, kui oleme tutvunud sellega, kuidas Reduxis töötada asünkroonse loogikaga, võime asuda selle etapi rakendamisele meie rakenduses. Peame tegema nii, et meie rakendus saaks suhelda mõne välise serveriga, vastu võttes sellelt ja edastades sellele andmeid. Teisisõnu, ees ootab meid põnev ja väga oluline teema. Alustame.