Обмен на данни между Redux приложение и сървър

Този раздел ще бъде за опитни ученици, които не спряха на постигнатото в Redux и решиха да стигнат до края на този урок. В следващите два раздела ще засегнем работата на приложение Redux с асинхронна логика, ще свържем нашето приложение със сървърна част и ще го научим да обменя данни с нея.

От предишните раздели знаем, че в основата на работата на Redux приложение лежи синхронен механизъм. Основните етапи на работа се състоят в изпращане на екшъни при възникване на някакво събитие в приложението, след това обновяване на стейта в store с функция-редюсер, уведомяване на компонентите на приложението за промяна на стейта и съответно показване на новата стойност на стейта в компонентите.

В реалния живот често се случва приложението да се нуждае и от асинхронна логика, например при работа с HTTP API заявки и получаване на данни от някакъв външен сървър. Затова, за да може нашият 'синхронен' Redux store да работи с такава асинхронна логика, се използва така нареченото middlware - софтуер, който е посредник или връзка между store на нашето приложение и, например, сървър, с който ще започнем работа в тази глава от урока.

За Redux са създадени много такива middleware, но най-широко разпространеният сред тях и официално препоръчван при работа на Redux приложения с асинхронна логика все още остава Redux Thunk. Този софтуер ни помага да използваме обикновени функции (или thunks), които могат да съдържат асинхронна логика, като setTimeout, Promises, async/await, за взаимодействие с нашия store. Що се отнася до самия термин, thunk е код, който върши някаква отложена работа.

Сега, след като се запознахме малко с това, как да работим в Redux с асинхронна логика, можем да пристъпим към реализирането на този етап в нашето приложение. Трябва да направим така, че нашето приложение да може да взаимодейства с някакъв външен сървър, като приема от него и му предава данни. С други думи, пред нас чака вълнуваща и много важна тема. Да започваме.