This is an excellent tutorial on sharing state between MFEs. My lots of gratitude to you.
@russellcanfield4 күн бұрын
Glad you found it helpful!
@maxtsh Жыл бұрын
This is super valuable content man, thanks for sharing your experience.
@russellcanfield Жыл бұрын
Thank you! Hard to make a one size fits all approach but everything follows some sort of pattern and hopefully it helps no matter what frameworks you use
@calvinnguyen14517 ай бұрын
Great introduction of an important topic!
@Dadaadad26821 күн бұрын
Hi Russel, can you use a Redux context provider on the window object in the same way as the Create context version? Or is this not a good idea?
@russellcanfield21 күн бұрын
You can share context, now the problem with sharing a global reference is that react won't re-render I believe because you aren't going through their API. There are a few approaches, you can useSynxExternalStore and sync the contexts - which will re-render as you expect, this can be done with a simple "event bus" approach as well to decouple things. You could also use an external package and share it as a singleton, the host can mount it in the DOM and you can use hooks to interface with the context as if the remote modules have it mounted - except you would not mount it in the remote modules.
@Dadaadad26821 күн бұрын
Also is there a github link for the Jotai example?
@russellcanfield21 күн бұрын
@@Dadaadad268 I apparently do not :( you can use a similar approach with Jotai, share some store atoms globally by reference (singleton module), useSyncExternal store, or use Jotai's subscription feature
@Dadaadad26819 күн бұрын
@@russellcanfield Thanks Russell. I'm trying the Jotai approach putting the reference on the window object. The imported module isn't updating the state though. I'm building the imported module first and running it in vite preview, the core app that imports it is running in dev mode. Should this still work?
@Dadaadad26819 күн бұрын
Updating the window object doesn't re-render the component, so this would be the issue...
@tranvansi63024 ай бұрын
I am not using nx mono repo I am having problem with react query (tanstack v5) when I wrap QueryProvider in host and MFE the problem I am having is when I add a product I use queryClient.invalidateQueries to reload data in MFE but when I go to host I have to F5 again. So is there any way to sync data immediately without F5 in host? Thank you
@russellcanfield4 ай бұрын
It should be sharing react-query as a singleton but the double QueryProviders may be to blame. By default react-query creates a react context, so if you create 2 query providers it might be creating two context providers
@tranvansi63024 ай бұрын
@@russellcanfield thank bro ❤❤. I have solved it now but there is a big problem that I have tried to search but still have not found a solution. If on the dev environment everything is fine but when I build to the production environment, there is a situation when I directly enter the url of a router with a remote to an MFE, the error is 404 The requested path could not be found, but if I click on the Link with the same path, the MFE can be loaded but reloading the page gives an error 404 The requested path could not be found, when I reload, in the Sources section of the dev tool there is no remote loaded. Can you give me some advice? Thank you
@russellcanfield4 ай бұрын
@@tranvansi6302 in dev you are probably hitting a URL fallback in webpack dev server, forget the setting name. But in production you may need a redirect back to your index.html so that react router can intercept and apply the routing rules. There are a few articles online with like nginx to setup for a SPA
@tranvansi63024 ай бұрын
@@russellcanfield Can you give me some resources or keywords to solve this problem. Thank you.
@russellcanfield4 ай бұрын
@@tranvansi6302 Sure, try this if you are using nginx dev.to/paulmojicatech/nginx-and-angular-spa-redirect-11ji
@GuilhermeHenrique-fp1wo Жыл бұрын
Do you have a with Rtk Query?
@russellcanfield Жыл бұрын
I don’t, I can try to take a look at it. I think you could share a store reference and maybe get away with it. But there may be a better pattern
@july_wayne Жыл бұрын
nice keep it up bro :D
@russellcanfield Жыл бұрын
Thank you! Let me know if you have anything you’d like to see covered