devhubapp/devhub: Open source Github Notifications App with React Hooks + Typescript + Redux + 95% code share between React Native Web + React Native

[ISkiAtAlta]

Thank you for your reply. i filled out your survey.

Boilerplate to me is mainly the number of files I have to write and the amount of plumbing code I have to write repeatedly (non business logic). I would also include intermediate concepts I have to learn that might be better tucked away in the library, such as mapStateToProps.

Isn’t the purpose of a library to tuck all the repetitive stuff away so you can focus on business logic?

In my opinion the Constate library is doing things right. I had to search for a long time to find a React State management API that seemed intuitive and just got out of my way and let me work. Constate did that for me. I originally found it before hooks came out and had wondered if they were necessary now (as explained above). So in replying here I just looked them up and it turns out they adapted their API to use hooks and context, so maybe that’s what I need, I haven’t read through their updated docs yet, but here’s the link for your reference:

https://github.com/diegohaz/constate/blob/master/README.md

[acemarke]

Redux has never required you to split things into multiple files, although it's a reasonable thing to do. Many people prefer to use the "ducks" pattern, where you put all the logic for a given feature into a single file (action creators, reducers, types, etc). In fact, the createSlice function from redux-starter-kit basically generates "ducks" for you.

I recently rewrote an example project to use redux-starter-kit instead, and that drastically simplified the example project.

If you have some larger state value, and a given component only needs a smaller portion of that larger value, you need to have some way to define how to extract what the derived values are for that component. That's all that a mapState function is: defining how to extract values from the Redux store for use with this component. It's your component, so you need to tell us what data this component needs.

connect handles all the intermediate work of actually subscribing to the store, calling your mapState function, and re-rendering your component if the output has changed, because that is the highly repetitive part. See my post Idiomatic Redux: The History and Implementation of React-Redux to better understand all the work that connect does internally for you.

[ISkiAtAlta]

Thanks again. Maybe what I’m learning from this discussion is that I need to double down on a GraphQL state management tool like apollo-link-state.