Wow! eBook
The Art of Micro Frontends: Build websites using compositional UIs that grow naturally as your application scales
Author(s): Florian Rappl (Author)
- Publisher: Packt Publishing
- Publication Date: 21 Jun. 2021
- Language: English
- Print length: 310 pages
- ISBN-10: 1800563566
- ISBN-13: 9781800563568
Book Description
Apply your experience of web development with HTML and JavaScript to build micro frontends for large-scale web projects using frameworks such as React and popular web tooling such as Node.js with Express or webpack
Key Features
- Cut through the complexities of designing a monolithic web architecture using micro frontend architecture
- Explore architecture patterns for building large-scale applications
- Learn how to build, test, and secure your micro frontends efficiently
Book Description
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).
What you will learn
- Understand how to choose the right micro frontend architecture
- Design screens for compositional UIs
- Create a great developer experience for micro frontend solutions
- Achieve enhanced user experiences with micro frontends
- Introduce governance and boundary checks for managing distributed frontends
- Build scalable modular web applications from scratch or by migrating an existing monolith
Who this book is for
This book is for software/solution architects or (mostly lead) developers as well as web developers and frontend engineers. Beginner-level knowledge of HTML and CSS along with a solid understanding of JavaScript programming and its ecosystem, including Node.js and NPM, is assumed.
Table of Contents
- Why Microfrontends?
- Common Challenges and Pitfalls
- Deployment Scenarios
- Domain Decomposition
- Types of Micro Frontend Architectures
- The Web Approach
- Server-Side Composition
- Edge-Side Composition
- Client-Side Composition
- SPA Composition
- Siteless UIs
- Preparing Teams and Stakeholders
- Dependency Management, Governance and Security
- Impact on UX and Screen Design
- Developer Experience
- Case Studies
Editorial Reviews
Review
"I have known and worked with Florian Rappl over the last 5 years. Florian is one of those rare architects who also loves to write code. In those 5 years, I’ve witnessed many projects where Florian took the lead architect role – introducing a micro frontend solution and guiding the teams to a successful implementation. He is one of the worldwide .NET and micro frontend community leading experts. In this book, The Art of Micro Frontends, Florian takes you on a learning journey that covers implementation ideas, scalability aspects, organizational issues, as well as security aspects. This will help you to successfully launch your own micro frontend solution – either from scratch or using one of the established frameworks.
For a long time, even large-scale systems have been developed as so-called monoliths, where the entire functionality has been implemented as a single and tightly integrated solution. For the backend part, the architecture pattern of microservices has become a very popular choice for addressing some of the downsides of a monolithic solution, such as the strong coupling of components, complex deployment scenarios, or large code bases managed by a single development team. Nowadays, microservice architectures build the foundation for many modern backend implementations.
Only in recent years have similar architectural approaches found their way into frontend solutions. One of the key requirements for flexible and extendable user interfaces is the modularization of components, especially for scenarios in which the layout and available features strongly depend on the user context or in which contained frontends for microservices need to be exposed seamlessly as a unified application.
The decoupling of functionality blocks is already a broadly applied aspect of modern monolithic frontend solutions, but together with the freedom of selecting the appropriate technology and the ability to independently develop in smaller teams, the micro frontend architecture pattern replicates further key benefits of microservice architectures also to the frontend. In particular, the capability of loading individual modules dynamically into the frontend enables the development, testing, and provisioning of features in shorter and self-contained release cycles. This makes the architecture pattern of micro frontends an excellent choice for large-scale and complex web development.
As for selecting microservices as the basis for the backend architecture, applying the approach of micro frontends might not be the ideal and canonical choice for every frontend solution. The isolation and decoupling of functional building blocks of the user interface introduce another layer of complexity, hence a well-designed and modularized monolithic web application might be a valuable or even a better fit for a given usage scenario. It is essential to evaluate and assess the advantages and disadvantages upfront as part of the solution concept. In this context, this book will also support you in the process of designing the right frontend solution architecture.
Become a developer superhero and build scalable web applications leveraging micro frontends."
--
Lothar Schöttner,
Founder and CEO of smapiot, Former Solution Architect for Accenture and Microsoft
About the Author
Florian Rappl is a solution architect working on distributed web applications for digital transformation and IoT projects. His main interest lies in the implementation of micro frontends and their impact on teams and business models.
As the lead architect he helped to create outstanding web applications for many industry leading companies. He regularly gives lectures on software design patterns and web development. Florian won multiple prizes for his work over the years and is recognized as a Microsoft MVP for development technologies.
He started his career in software engineering before studying physics and helping to build an energy-efficient supercomputer. Florian currently lives in Munich, Germany, with his wife and two daughters.
