https://github.com/retreon/retreon
A type-safe, batteries-included redux toolkit.
https://github.com/retreon/retreon
async-actions framework immer redux redux-actions redux-toolkit
Last synced: 5 months ago
JSON representation
A type-safe, batteries-included redux toolkit.
- Host: GitHub
- URL: https://github.com/retreon/retreon
- Owner: retreon
- License: mit
- Created: 2019-11-22T22:32:11.000Z (almost 6 years ago)
- Default Branch: main
- Last Pushed: 2023-09-10T18:25:43.000Z (about 2 years ago)
- Last Synced: 2025-05-12T21:56:05.158Z (5 months ago)
- Topics: async-actions, framework, immer, redux, redux-actions, redux-toolkit
- Language: TypeScript
- Homepage: https://retreon.github.io/
- Size: 2.61 MB
- Stars: 5
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
---
## Project Status
:no_entry: UNMAINTAINEDState management is still heavily evolving in React. While I believe Retreon is one of the best ways to use Redux, the community is modernizing towards modular hook-based libraries.
I would recommend exploring [Recoil](https://recoiljs.org/), [Jotai](https://jotai.org/), or any of the newer approaches.
## Purpose
Redux is a phenomenally powerful tool, and it can be a true joy to work with. But it takes time to find good tooling and develop healthy patterns.Retreon aims to provide good patterns and strong types out of the box, including tools for async actions and error handling. Retreon is [FSA compliant](https://github.com/redux-utilities/flux-standard-action#readme).
Here's a taste:
```typescript
// actions.ts
const fetchResource = createAction.async('fetch-resource', async (id: number) => {
const response = await fetch(`/resources/${id}`)
return response.json()
})
``````typescript
// reducer.ts
const reducer = createReducer(initialState, handleAction => [
// Called as soon as the action starts
handleAction.optimistic(fetchResource, (state, resourceId) => {
state.loading = true
}),// Optionally, handle errors if your action fails
handleAction.error(fetchResource, (state, error) => {
state.loading = false
}),// Called when the action's promise resolves, passing the payload
handleAction(fetchResource, (state, resource) => {
state.loading = false
state.resource = resource
}),
])
```If you prefer to learn by example, take a gander at [the examples directory](https://github.com/retreon/retreon/tree/main/examples), or check out [TodoMVC](https://retreon.github.io/todomvc/) to see a functioning application.
## Installation
Retreon can be installed through npm.```bash
# NPM
npm install retreon# Yarn
yarn add retreon
```Retreon depends on middleware to implement async actions and error handling. Once it's installed, register it with your redux store:
```ts
// Wherever you create your redux store...
import { middleware } from 'retreon'createStore(reducer, applyMiddleware(middleware))
```## Documentation
Documentation is hosted on [the retreon website](https://retreon.archetype.foundation):- [API](https://retreon.archetype.foundation/creating-actions)
- [Examples](https://github.com/retreon/retreon/tree/main/examples)---
Retreon is inspired by [redux-actions](https://github.com/redux-utilities/redux-actions) and [immer](https://github.com/immerjs/immer).