This repo aims to be a guide on how to implement Clean Architecture using @reduxjs/toolkit
.
The NPM library redux-clean-architecture
is a set of type-level utilities that helps achieve perfect type inference.
Benefits
- Clears guideline about how to organize your code in accordance with the clean architecture principles.
- No need to explicitly call
dispatch()
on the UI side. - Strict isolation between the UI and the core. Port your web app to React Native or switch to another UI framework without having to re-write a single line of the core logic.
- Stop wondering about how things should be named. Thanks to the use of TypeScript's template literal types Name things once then let intellisense guide you.
https://user-images.githubusercontent.com/6702424/147381177-346293ec-8562-4aa4-ac62-45a5404d7ccc.mov
Install / Import
$ yarn add @reduxjs/toolkit redux-clean-architecture
Examples setups
Canonical setup
A canonical setup can be found here: src/test/demo-app
Todos List app
A todo list example can be found
Credit goes to @leosuncin.
Enterprise grade app
You can consult the source code of onyxia-web to see how redux-clean-architecture
is used in a real world complex application.
Onyxia: A data science-oriented container launcher.
Starting the demo app
git clone https://github.com/garronej/redux-clean-architecture
cd redux-clean-architecture
yarn
yarn build
yarn start-demo-app