Redux is a design pattern for centralizing application state and unidirectional data flow in apps. It can be used with SwiftUI by making the store conform to ObservableObject and wrapping the state in a @Published property. The store is injected into views using environmentObject and views access the state to compute properties or directly in their body. Views don't directly access the store but derive properties from the state, keeping views cleaner and closer to React syntax. An example Movie app demonstrates a full Redux implementation in SwiftUI.

1. SwiftUI Data Flow
with Redux
Thomas Ricouard (@Dimillian) - Glose and open
source stuff

2. Redux
• Is a design pattern
• To architecture your app data flow
• Centralize your application state
• And I love it!

3. But Redux????
• Single source of truth
• All business logic in one place
• Unidirectional data flow
• All state modification happen in reducers
• Easy to build isolated and reusable UI components

4. Redux data flow

5. Redux ♥ SwiftUI
Store conform to ObservableObject and our application state is wrapped in a
@Published property wrapper

6. Redux ♥ SwiftUI
We instantiate our Store with our AppState and inject it in our root view using
environmentObject view modifier

7. Redux ♥ SwiftUI
Our store is accessible in any view using @EnvironmentObject property wrapper

8. Redux ♥ SwiftUI
We can access our state to compute view properties or we can access it in
the body function directly

9. SwiftUI ♥ React
• Implementation here: https://github.com/Dimillian/
SwiftUIFlux
• You don’t access the store environmentObject directly
• You derivate your view properties from your state
• It’s cleaner + closer to modern React / Redux syntax

10. MovieSwiftUI
• I’ve made a real world and full open source SwiftUI +
Redux application.
• https://github.com/Dimillian/MovieSwiftUI

11. MovieSwiftUI

12. Custom redux
implementation
Now our app SceneDelegate is a bit more prettier

13. Custom redux
implementation
Because SwiftUIFlux have a StoreProvider built in (+ few other goodies)

14. ConnectedView
Receive new State
map(state) -> Props
body(props) -> some View
Dispatch action / State
modification

15. A simple view component

16. ConnectedView

17. ConnectedView

18. ConnectedView

19. How does it work?

20. How does it work?

21. How does it work?

22. How does it work?

23. How does it work?

24. How does it work?

25. How does it work?

26. Here is more!

27. One more component

28. One more component

29. One more component

30. Conclusion
• Easy separation of concern
• Work great with SwiftUI built-in data flow properties
wrappers and helpers
• View component are clean, small, reusable and empty of
business logic
• You can focus on your UI code, all business / models
bugs are in your reducers!

31. Thank you!
🚀