Oskari's Blog

Communication and state management in a micro frontend are challenging problems - just like they are for backend systems using microservices. Any shared state between applications in distributed systems creates a slew of headaches: scalability, bottlenecks, versioning…

What if I told you, you should not be storing all of your data in a React lifecycle? There are many tools using the built-in browser APIs and non-lifecycle methods in React that can be very powerful for the right use cases. This is the second part in a series where I want to…

Don't use global state for everything . Always use the right tool for the job. React is an amazing framework but far from perfect, and one of the areas where it falls short is state management . When React picked up steam in 2015, the promise of a performant Virtual DOM…

A recently published ECMAScript proposal plans on introducing type syntax to JavaScript natively inspired by Microsoft's work on TypeScript. Types are here to stay and if you aren't using TypeScript already it's time for you to learn it today . I was initially skeptical about…

How can you deploy the same micro frontend application to testing, staging, and production environments? How can your application support on-premise, cloud, and hybrid deployments simultaneously? How can you scale multiple teams working on different parts of the architecture…

How can we safely, efficiently, and performantly use Webpack Module Federation’s Dynamic Remote Containers in a React micro frontend app? Let’s start with a vision of what we want: RemoteComponent is a React component we can use throughout our application to render modules from…

As you develop a large-scale Micro Frontend application built using Webpack’s Module Federation, you will eventually need to share data and communicate between your micro-apps. I will cover the many options available in later articles but first I want to share with you an example…

You may have noticed the Chrome browser recently incorporated a feature on the start page that displays any active carts you have left behind at certain e-commerce websites: Chromium (which powers both Chrome & Edge browsers) added support for this feature in the past year. But…

Module Federation is an excellent tool for constructing a micro-frontend architecture in React applications. I will show you how to use it in a step-by-step guide to building a Host-Remote pattern micro-frontend in React. Why a Micro Frontend? Micro-frontends help us break large…

Welcome to my blog! My name is Oskari Rautiainen and I'm a developer. I love to learn, explore new concepts, and most of all I love to build things - especially great experiences for users that just work . For me a "user" is anyone that consumes what I create. Whether its an end…