Book Image

The Art of Micro Frontends

By : Florian Rappl
Book Image

The Art of Micro Frontends

By: Florian Rappl

Overview of this book

Micro frontend is a web architecture for frontend development borrowed from the idea of microservices in software development, where each module of the frontend is developed and shipped in isolation to avoid complexity and a single point of failure for your frontend. Complete with hands-on tutorials, projects, and self-assessment questions, this easy-to-follow guide will take you through the patterns available for implementing a micro frontend solution. You’ll learn about micro frontends in general, the different architecture styles and their areas of use, how to prepare teams for the change to micro frontends, as well as how to adjust the UI design for scalability. Starting with the simplest variants of micro frontend architectures, the book progresses from static approaches to fully dynamic solutions that allow maximum scalability with faster release cycles. In the concluding chapters, you'll reinforce the knowledge you’ve gained by working on different case studies relating to micro frontends. By the end of this book, you'll be able to decide if and how micro frontends should be implemented to achieve scalability for your user interface (UI).
Table of Contents (21 chapters)
1
Section 1: The Hive - Introducing Frontend Modularization
6
Section 2: Dry Honey - Implementing Micro frontend Architectures
14
Section 3: Busy Bees - Scaling Organizations

What this book covers

Chapter 1, Why Micro Frontends?, covers micro frontends in general, their primary areas of use, as well as the challenges and problems they bring. This includes what strategies can be used to mitigate these problems and challenges.

Chapter 2, Common Challenges and Pitfalls, discusses the most important challenges and pitfalls when implementing micro frontends, together with a path leading to a proper solution.

Chapter 3, Deployment Scenarios, looks at the scalability of micro frontends with respect to their deployment. This includes examples of CI/CD pipelines and their ideal use cases.

Chapter 4, Domain Decomposition, reveals a way of thinking that can be used when deciding what should be placed in a micro frontend. This chapter introduces the use of methods from domain-driven design to make these decisions.

Chapter 5, Types of Micro Frontend Architectures, introduces the phase space for creating micro frontend architectures, including the most popular patterns out there. This chapter outlines the advantages and disadvantages of the extremes within the phase space.

Chapter 6, The Web Approach, discusses the simplest approach of handling micro frontends by leveraging existing web technologies such as iframes and links.

Chapter 7, Server-Side Composition, discusses a popular backend method of combining frontend fragments coming from different servers into a single website.

Chapter 8, Edge-Side Composition, takes an even more simplified approach than server-side composition to compose a website on the edge using a reverse proxy setup.

Chapter 9, Client-Side Composition, shows how to leverage Web Components to compose one website from different fragments in the user’s browser.

Chapter 10, SPA Composition, discusses a way of bringing together different SPA websites in a joint solution composed within the user’s browser.

Chapter 11, Siteless UIs, introduces a micro frontend pattern that brings popular properties of serverless functions to the frontend.

Chapter 12, Preparing Teams and Stakeholders, deals with the organizational shift that is necessary when introducing micro frontends.

Chapter 13, Dependency Management, Governance, and Security, provides some guidance on dependency sharing and general micro frontend governance for projects of any kind. This chapter also touches on the topic of security from deployment to runtime.

Chapter 14, Impact on UX and Screen Design, reveals the most critical aspects that need to be handled when creating designs for micro frontend solutions with practically unlimited scalability.

Chapter 15, Developer Experience, lists the most crucial properties to include for satisfying internal or external developers of the project. This is crucial for keeping up a high level of productivity.

Chapter 16, Case Studies, lists three different real-world micro frontend projects with their background, core decisions, and overall architecture used.