What's the work around to use reducer dispatch to work outside React component without using store

Question

I have setup a reducer in a project which uses react, typescript and nextJS.

Is there a way I can use this reducer to dispatch the event outside react component i.e (APIservice).

I have found answers which instructs to use store, but in my case I don't use the store. I just used the useReducer hook in the React FC component.

Any solutions apprecaiated.

Thanks in adavance.

Answer 1

You can implement async function for data fetching with a redux middleware like redux-thunk. (or redux-saga) With the middleware you can await the data fetching and dispatch the data to your reducer.

redux-thunk: https://github.com/reduxjs/redux-thunk

redux-saga: https://redux-saga.js.org/docs/introduction/BeginnerTutorial.html

you can also check the NextJS examples from their github page. They have examples for implementing redux-thunk and redux-saga