📐 A clean architecture framework 📐
🎯 For the front and the back 🎯
🔩 Focusing on achieving great type inference 🔩

• Benefits
• Install / Import
• Examples setups
  • Canonical setup
  • Todos List app
  • Enterprise grade app
• Opinionated restrictions
• Starting the demo app

Benefits

• Clean architecture without the object-orientedness.
• No need to explicitly call dispatch() on the UI side.
  As a matter of fact, Redux being used under the hood is an implementation detail that can as well be ignored by the dev working on the UI.
• Strict isolation between the Core and the UI. 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.
• It's not specifically a React framwork, it's not even specifically a frontend framwork, it can and is be used on the backend.
• Names things once, it propagate through all the codebase via TypeScript's template literal types. No more hard to maintain stuttering.
  Name things once then let intellisense guide you.
• The core can tell the UI to do thing imperatively. Like "Play a sound now" which is something that is impossible to do cleanly with just states. (isSoundShouldBePlayedNow: boolean ?)

Install / Import

$ yarn add redux-clean-architecture evt @reduxjs/toolkit

Examples setups

Canonical setup

A canonical setup can be found here: 👉 src/test/demo-app👈 .

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