![]() ![]() It does provide a github repository with a complete example for you to check how it was setup and how it plays together with React/Redux: Starting small #REDUX SAGA HOW TO#This article does not explain how to setup sagas or a react/redux project (as there’s already the documentation and countless examples). There should be an “unsaved changes” indicator on the UI, that is displayed when a change is first recorded and hidden when a successful save response is received from the server.Other actions (such as creating an image) should save immediately.Some actions (such as dragging an image) should be debounced, in order to only trigger a save operation to the server after an amount of time.There must be a whitelist of actions (only actions on the whitelist will trigger a save).The save operation follows these requirements: The persistence mechanism described in this article assumes that you’ll save the whole state to the server (although you can easily select just a subset of it). The documentation for Redux and redux-sagas are great starting points and a good reference if you have questions throughout this article. This article assumes that you have some redux and redux-saga knowledge, but I’ve aimed for the explanations to be gradual and simple, so newcomers to these libraries can learn from them. That prompted us to replace redux-storage with a custom saga and liked the result so much that decided to share it with you. ![]() It relied on the redux-storage library, a simple plug and play library for loading/storing data, but we started having more complex requirements on the persistence mechanism. Our app already persisted the state by loading it from the server on page navigation and by saving it periodically, after some specific actions were triggered. #REDUX SAGA CODE#We really liked the way it helps orchestrate complex flows that have side-effects, by using ES6 generators, which promote more readable asynchronous code and simpler unit tests. We’ve started using sagas to manage image uploads and to implement a history mechanism (undo/redo). ![]() Redux-saga is a fairly new library in the Redux ecosystem, one that has quickly gained adoption and traction in the community. 12 minute read Persist Redux state by using Sagas ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |