Why creating one global store state for heroes instead of locally to component?

[angelhodar]

Hey @webmasterdevlin, I have just seen your awesome article here and Im just curious about why you decided to create a global store for your heroes insted of importing your HeroService in your Heroes component and using the state internal to that component. Im new to React and I am using the easy-peasy package. I dont know if I should create a global store for each API resource I have in my app.

Thanks in advance ;)

Note: I accidentally created this same issue in your hero-vue repo, I have just closed it :P

[webmasterdevlin]

Hey Angel, the job of the store is to update the state which changes the UI.

Services job is to send requests to a backend.

Normally, you would separate them for maintainability and cleaner code.

On Thu, Jul 9, 2020 at 10:26 AM Angel notifications@github.com wrote:

Hey @webmasterdevlin https://github.com/webmasterdevlin, I have just seen your awesome article here https://devlinduldulao.pro/easy-peasy-in-a-nutshell-with-react-easy-peasy-code-sample/ and Im just curious about why you decided to create a global store for your heroes insted of importing your HeroService in your Heroes component and using the state internal to that component. Im new to React and I am using the easy-peasy package. I dont know if I should create a global store for each API resource I have in my app.

Thanks in advance ;)

Note: I accidentally created this same issue in your hero-vue repo, I have just closed it :P

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/webmasterdevlin/heroes-easy-peasy/issues/1, or unsubscribe https://github.com/notifications/unsubscribe-auth/AFIBNOHHGEOXEJD7ECHC4R3R2V5MTANCNFSM4OVLMDGA .

-- Regards, Devlin Duldulao

[angelhodar]

Hey Devlin, thank you for your answer! So would you recommend to create a store for each resource of my API and then combine them in a global store to be accessed by any component?

And one last question, just in case you have any example or article, how do you manage web sockets in a React app? Now I have a socket variable in my state initialized by the root component so any other component can access it, but it seems a bit confusing that the socket variable is part of the state instead of a separate variable that can be imported from any component. What do you think about that?

[webmasterdevlin]

Yes.

I haven't tried React with Websocket but here's a good link I would recommend.

https://dev.to/aduranil/how-to-use-websockets-with-redux-a-step-by-step-guide-to-writing-understanding-connecting-socket-middleware-to-your-project-km3

On Thu, Jul 9, 2020 at 12:13 PM Angel notifications@github.com wrote:

Hey Devlin, thank you for your answer! So would you recommend to create a store for each resource of my API and then combine them in a global store to be accessed by any component?

And one last question, just in case you have any example or article, how do you manage web sockets in a React app? Now I have a socket variable in my state initialized by the root component so any other component can access it, but it seems a bit confusing that the socket variable is part of the state instead of a separate variable that can be imported from any component. What do you think about that?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/webmasterdevlin/heroes-easy-peasy/issues/1#issuecomment-656039858, or unsubscribe https://github.com/notifications/unsubscribe-auth/AFIBNOHTAEVCLDAPCTY3SFDR2WJ33ANCNFSM4OVLMDGA .

-- Regards, Devlin Duldulao