javascript - Organizing and keeping your flows and resources and sags clean with redux
问题描述
Good day,
I'm in the process of implementing my first large scale react + redux + react saga app which I intend to scale massively and still have a lot of open questions. As I understand it things work the following way
- Reducers -> mutate state tree
- Actions -> trigger state changes
- Store -> single source of truth
- Redux Saga -> side effects
I also use connected react router to try and keep things purer and dispatch route changes through my store.
I try and keep a reducer per microservice resource in my application since I have many microservices I interact with for example.
- User Info (which I use on basic info etc.)
- User ( for login, sign up)
- Communication Preferences
- Investments
- UI (for alerts and messaging)
- Routing (managed by connected router)
In the beginning this worked really well, but I started getting a little confused on some things.
- Where do I 'chain' my side effects together?
So if for example a call to login fails and I raise an alert do I dispatch an action inside my saga for login?
And if I need to dispatch for example default signup for communication preferences do I do that in the saga and have one action?
What if this particular screen doesn't want to show an alert on failure? Would I pass an onError function into my action to be handled by my saga? (currently a business requirement to ignore a specific failure on the login screen)
- Where do I handle my routing?
When login succeeds I can easily dispatch a push event to route from my saga, but this seems unpure, and I'd like to handle this elsewhere, would I then add a change to state? this seems messy.
- Handling return sessions
Currently in my app I have a Token stored in localstorage. When the user hard refreshes the page I have a component at the top of my app which logs the user back in by dispatching an action.
However, is this async? will the children still render while that action is firing? my concern is I have a route checking a state value (isLoggedIn) as a child. This would then possibly cause a race condition on rendering.
Apologies for the multipart question, but the application from theory to practice for Redux apps is quite a big jump for me.
I really appreciate the reading of the question.
解决方案
推荐阅读
- javascript - 标签需要在 Jasmine beforeEach 函数的同一行中关闭吗?
- kotlin - 如何在泛型接口中引用实现类
- selenium-chromedriver - ChromeDriver - 无头选项会导致 WebDriver 崩溃,当应用于添加的扩展程序时
- css - 使用引导导航栏折叠时的边框底部悬停长度
- python - 哪种算法适合我的时间序列数据?
- r - 使用 while 循环重复一个函数,直到在 r 中满足条件
- python - 为什么当源中有其他静态文件时,我不能在我的 django 项目中添加静态文件?
- angular - http服务调用后的Nativescript-angular,视图未更新(Angular 5)
- java - Java 8 - 可重入锁/锁定对象
- google-cloud-platform - 即使 autoDelete 设置为 true,附加到实例的磁盘也不会被删除