How to provide a Redux store to Remix JS project?

Viewed 2419

I've been following closely Remix Run JS (https://remix.run/) and I've been working with some tutorials, however, I haven't found anywhere here or in the web of how to implement a redux store:

I was thinking in wrapping the App component like this but I'm not sure if that's how it should be done:

const store = createStore(rootReducer);

export default function App() {
  return (
    <Provider store={store}>
      <html lang="en">
        <head>
          <meta charSet="utf-8" />
          <meta name="viewport" content="width=device-width,initial-scale=1" />
          <Meta />
          <Links />
        </head>
        <body>
          <Link to="/posts">Posts</Link>
          <Outlet />
          <ScrollRestoration />
          <Scripts />
          {process.env.NODE_ENV === "development" && <LiveReload />}
        </body>
      </html>
    </Provider>
  );
}
1 Answers

Why do you want to use Redux with Remix? Loaders and actions etc are designed to handle your server-side data in a good way (actions will retrigger loaders etc.). For other, client side state, you can use React Context and stuff. So I don't think Redux is realy needed in a Remix app. It's not that it's not possible, but I think you should look into how to not use it.

Related