Better async redux saga

Transcript

1. GENERATORS REDUX SAGA & Kushan Joshi

2. KUSHAN JOSHI Mapbox OpenStreetMap @kushan2020

3. GENERATORS What are Generator Functions ? Are functions that can

   hold state They can be paused / resumed 
 on demand.

4. GENERATORS Unlike functions, Generator functions do not run to completion

   "

5. GENERATORS Should I run?

6. GENERATORS EXAMPLE

7. GENERATORS EXAMPLE

8. GENERATORS EXAMPLE

9. GENERATORS EXAMPLE is called an iterator

10. ITERABLE

11. ITERABLE

12. ITERABLE

13. GENERATORS Built in iterables Array, String, Map, Set, TypedArray

14. GENERATORS EXAMPLE

15. GENERATORS EXAMPLE

16. GENERATORS EXAMPLE

17. GENERATORS EXAMPLE

18. GENERATORS EXAMPLE

19. GENERATORS EXAMPLE

20. GENERATORS EXAMPLE

21. GENERATORS What are generators, again ? Give you a nice

    way to generate an Iterator

22. GENERATORS Great! Let us look at Redux

23. REDUX PROBLEM Store ✈ Action

24. REDUX PROBLEM Store ✈ ✈ ✈ ✈ ✈ Actions

25. REDUX PROBLEM Store Async Actions? Async-Action

26. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

27. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

28. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

29. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

30. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

31. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

32. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

33. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

34. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

35. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

36. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

37. REDUX PROBLEM Store There are a lot of tools to

    solve this problem. Async-Action

38. REDUX PROBLEM Store Async-Action Easy bro!

39. REDUX PROBLEM Store Async-Action One of them is Redux Saga

40. REDUX SAGA Is a library which helps manage async actions

    with generators. 5 Redux Saga

41. REDUX SAGA It runs the generator functions 
 for you.

    It gives you helper functions to interact with Redux

42. REDUX SAGA ✈

43. REDUX SAGA ✈

44. REDUX SAGA

45. REDUX SAGA

46. GENERATORS How does it compare with 
 Redux Thunks Nice!

47. REDUX THUNKS LOGIN WITH THUNKS

48. REDUX THUNKS LOGIN WITH THUNKS

49. REDUX THUNKS LOGIN WITH THUNKS

50. REDUX THUNKS LOGIN WITH THUNKS

51. SAGA LOGIN WITH SAGA

52. SAGA LOGIN WITH SAGA

53. SAGA LOGIN WITH SAGA

54. SAGA LOGIN WITH SAGA

55. SAGA LOGIN WITH SAGA

56. SAGA LOGIN WITH SAGA

57. THUNKS FEATURE PARITY WITH THUNKS

58. GENERATORS Isn’t this just too complex for a login

59. THUNKS

60. THUNKS FEATURE PARITY WITH THUNKS

61. NETWORK RACE

62. NETWORK RACE

63. NETWORK RACE

64. NETWORK RACE

65. SAGA LOGIN WITH SAGA

66. SAGA LOGIN WITH SAGA

67. SAGA LOGIN WITH SAGA ✈ Logout!

68. SAGA LOGIN WITH SAGA Me?

69. SAGA LOGIN WITH SAGA

70. SAGA LOGIN WITH SAGA

71. SAGA LOGIN WITH SAGA

72. SAGA LOGIN WITH SAGA

73. SAGA LOGIN WITH SAGA

74. GENERATORS Can’t you just use Async / Await and be

    happy?

75. SAGA ASYNC AWAIT IMPLEMENTATION OF REDUX SAGA

76. SAGA ASYNC AWAIT IMPLEMENTATION OF REDUX SAGA

77. GENERATORS So, are generators useless?

78. GENERATORS The whole point of generators is that you can

    manipulate them while they are suspended.

79. GENERATORS Think of it as a conversation between the code

    that runs the generator and the generator itself. Generator Redux Saga
 (runner)

80. GENERATORS Generator Redux Saga
 (runner)

81. GENERATORS Generator Redux Saga
 (runner)

82. GENERATORS Generator Redux Saga
 (runner)

83. GENERATORS Generator Redux Saga
 (runner)

84. GENERATORS Generator Redux Saga
 (runner)

85. GENERATORS Generator Redux Saga
 (runner)

86. GENERATORS Async or any other magical being Redux Saga
 (runner)

87. GENERATORS ? Async or any other magical being Redux Saga


    (runner)

88. GENERATORS Which is why it is so easy to test

    a redux saga, at every yield @

89. REDUX SAGA TESTING

90. REDUX SAGA TESTING

91. REDUX SAGA TESTING

92. REDUX SAGA TAKE AWAYS Generator functions are fun Redux Saga

    is an amazing solution to the async action problem

93. REDUX SAGA THANK YOU

94. REDUX SAGA TAKEAWAY

95. REDUX SAGA TAKEAWAY

96. REDUX SAGA TAKEAWAY

97. REDUX SAGA TAKEAWAY