Engatinhando_com_Redux_Saga.pdf

Transcript

1. Engatinhando com Redux Saga Jonathan Cruz (Shun) Github/Twitter joohncruz
2. “SIM... mais uma biblioteca, porém ela não é nova...”
3. ALINHANDO CONCEITOS
4. REDUX É uma implementação criada pelo Adam Abramov para implementar a arquitetura web Flux, criada pelo Facebook
5. ADAM ABRAMOV • https://github.com /gaearon • http://twitter.com/ dan_abramov
8. COMO?
9. COMO?
10. GENERATORS
11. JS ‘NEW’ FEATURES? ARROW FUNCTION REDUCE GENERATORS CLASS LET MAP CONST ITERATORS TEMPLATE LITERALS
12. GENERATORS Generators são funções especiais que podem ser executadas, pausadas e continuadas em diferentes estágios da sua execução. YIELD
13. COMO?
14. COMO?
15. ASYNC (promise)?
16. ASYNC (generator)?
17. CO É um runtime em torno dos generators, tornando as chamadas assíncronas parecerem mais síncronas. Para cada yield + promise, ele executa a promise e repassa o resultado para o generator.
19. Espera tornar os efeitos colaterais do aplicativo mais fáceis de gerenciar, mais eficientes de executar, fáceis de testar e melhores no tratamento de falhas.
20. Métodos • fork(): realiza uma operação não bloqueante com a função passada • take(): pausa as operações até receber uma redux action; • race(): executa Effects simultaneamente, e cancela todos quando um efeito retorna seu resultado; • call(): executa uma função. Se essa função retornar uma Promise, ele irá pausar a Saga até a Promise ser resolvida;
21. Métodos • put(): despacha uma redux action; • select(): executa uma função seletora que irá buscar dados do estado global do Redux; • takeLatest(): irá executar as operações recebidas, porém, irá retornar apenas o valor da última; • takeEvery(): irá retornar os valores de todas as operações recebidas;
22. CODE!!!
23. store/forgotPassword/sagas.js
24. store/configureSagas.js
25. store.js
26. Really?
28. Referências • https://medium.com/nossa-coletividad/redux-saga-voc%C3%AA-no-controle-das-oper a%C3%A7%C3%B5es-ass%C3%ADncronas-71c9e6b3aabc • https://redux-saga.js.org/ • https://medium.com/nossa-coletividad/es6-generators-estão-mudando-nosso-modo- de-escrever-javascript-e99f7c79bdd7 • https://medium.com/reactbrasil/iniciando-com-redux-c14ca7b7dcf