esamattis / esamattis/immer-reducer

Share example project on README?

Open
#50 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
223
Forks
15
PR merge metrics
No merged PRs in 30d

Description

Using ImmerReducer with TypeScript is such a pleasant experience, everything is type-safe, and with some extra work you can have the compiler enforce immutability on the state outside of producers.

I built a little React based calendar app that uses two ImmerReducers for state management. This example provides a useful foundation to build a more complex app made up of several small reducers:

https://github.com/gamedevsam/calendar-appointments

The magic sauce are these files in the Redux directory:

- [src/redux/index.ts](https://github.com/gamedevsam/calendar-appointments/blob/master/src/redux/index.ts)
- [src/redux/AgendaReducer.ts](https://github.com/gamedevsam/calendar-appointments/blob/master/src/redux/AgendaReducer.ts)
- [src/redux/AddReminderReducer.ts](https://github.com/gamedevsam/calendar-appointments/blob/master/src/redux/AddReminderReducer.ts)

And of course the connector components:

- [src/components/AgendaDay/AgendaDayContainer.tsx](https://github.com/gamedevsam/calendar-appointments/blob/master/src/components/AgendaDay/AgendaDayContainer.tsx)
- [src/components/AddReminder/AddReminderContainer.tsx](https://github.com/gamedevsam/calendar-appointments/blob/master/src/components/AddReminder/AddReminderContainer.tsx)

One other noteworthy thing is the immutable generic type, which allows TypeScript to enforce immutability at compile time: [src/types/immutable.ts](https://github.com/gamedevsam/calendar-appointments/blob/master/src/types/immutable.d.ts)

---
![image](https://user-images.githubusercontent.com/47303296/79009662-0a50c900-7b2e-11ea-8072-8bd0fce81745.png)

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.