loading...

Revisiting Redux with Context and Hooks

Brendan B on April 29, 2019

I develop a small, internal facing UI, and it's been using Redux for awhile now. The store provides functionality for certain global concerns lik... [Read Full]
markdown guide
 
[deleted]
 

Do you have any public code I could look at? It's hard to tell exactly without seeing the context :)

 

Got it working now. I took out params = {} thinking it wasn't required

That's great! Glad it worked

 

Thanks about your articles, do have a repo for this article?

 

I never made one, sorry! I may one day and if I do I'll post it here, but I'm more likely to write an update to this that's a little less heavy handed with context, I'll have a repo with that one if I do.

 

Thanks for the article. It seems really a pain to implement redux... You have any repo with best practices architecture redux/hooks to recommend ? a simple one if possible, thanks :)

 

I don't have a public one, yet! But I'll post something here when I get to working on a big refactor of a public project I have. I've learned a few things since I wrote this and think there are some cleaner ways to do stuff, especially around actions. I do agree that redux is a lot of implementation detail, and while this article cuts down on some of that it's still a lot of boilerplate that I'd like to reduce, without putting a lot of work on the consuming component.

 

Thanks, looking forward for a repo :D

By the way, I tried this redux dev tools package to trace hooks activity, really cool: github.com/troch/reinspect

i couldn't seem to get this to work. Where did you add it? I tried around the main app or storecontext but it didn't show that it updated state in the devtools

 

Using this architecture does it mean that any changes to the store will cause re-renders to all the components even if they aren't interested in a piece of state?

 

I tested this out on a project I used to work on and didn't see re-renders, although it may depend on the implementation - I believe (although I could be wrong) that the way context works here in conjunction with the reducer hook means that state changes don't cause re-renders in anything but the components using that piece of state.

 

hit there is any way to access the state tree in the actions?
like store.getState() ?

 

Sorry for the late reply. One way would be in the 'getRootActions' method in the StoreProvider component, to pass another parameter after dispatch, 'state', and then pass that into bindDispatchToActions to be available to any of the actions it iterates over. It's kind of clunky, but quite honestly this whole approach here is a bit heavy. I think I might, especially for a smaller app, just leave actions context out entirely, export some basic action functions from a file and just import those anywhere they're needed, passing in dispatch at point of use.

code of conduct - report abuse