New Coder
New Coder

Reputation: 29

Storing data in REDUX store using axios React

I am new to redux and working on a MERN app. I need to use data from a collection "Assetmaster" in a few of the react components.

One option is fetching the data through axios, useEffect and render my table in the react component. But as I need to use this data in other components also i have to dispatch it to the Redux store using useDispatch(). In this case other components can use the data using useSelector().

However I need to know if it is possible to get the data directly in Redux Store centrally without fetching it in any of the components. And in such case do we need to use useEffect to ensure the data is fetched each time any changes in the collection is made to the database through any of the react component.

Upvotes: 0

Views: 402

Answers (2)

Himanshu Gunwant
Himanshu Gunwant

Reputation: 5

You can fetch data in useEffect once when app loads and store it on store. After that you can access data from store without re-fetching.

When a component updates some data on database instead of fetching again just update it on store .

Upvotes: 0

Mhmdnzr
Mhmdnzr

Reputation: 143

If your useEffect didn't have any dependencies, that's not correct to fetch data because it (useEffect) fetch data only once. also check your dependencies render many time it cause get lag and heavy processing load.
at all, Redeux and redux-toolkit like redux-thunk uses for mange and storing data between components (if you know about design patterns, it like proxy design pattern). if you had sidebar panel or something else that do not need to render client data and save it i recommend you to use contextApi but if you need manage user data or store it some where like server, cookies, local storage,... if recommend to use Redux and redex-toolkit.
To learn about redux and how can work with this tool, i put my sample source code here for you.
Source code

Upvotes: 0

Related Questions