How to Easily Create an Event Bus for a Micro Frontend
Sep 5, 2022 ☕ 13 min readCommunication 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…
4 Ways to Simplify React State (By Not Using React)
Jul 29, 2022 ☕ 9 min readWhat 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…
6 Ways to Simplify State Management in React (Without Using Global State)
Jul 29, 2022 ☕ 11 min readDon'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…
Why You Need to Learn TypeScript Now
Jul 17, 2022 ☕ 9 min readA 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…
4 Ways to Use Dynamic Remotes in Module Federation
Jul 6, 2022 ☕ 7 min readHow 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…
Rendering Dynamic Remote Containers in a React Micro Frontend
Jul 5, 2022 ☕ 4 min readHow 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…
Using Zustand in a Micro Frontend
Jun 2, 2022 ☕ 3 min readAs 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…
How does Google Chrome display shopping carts on the start page?
May 22, 2022 ☕ 5 min readYou 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…
How to Use Webpack Module Federation in React
May 9, 2022 ☕ 8 min readModule 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…
Hello World
Apr 28, 2022 ☕ 2 min readWelcome 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…