
The Art of Micro Frontends
Beschreibung
The organizational pattern of micro frontends allows you to split web applications into multiple parts, where each part can be owned by an autonomous team. Each team can have its own development and deployment life cycle, allowing every part of an application to be shipped in isolation. Following the strategies outlined in this book, you can avoid complexity while increasing resilience for your frontend. This updated second edition will guide you through the patterns available to implement a micro frontend solution. You'll learn about micro frontends, the different architecture styles, and their areas of use. Then, you'll learn how to prepare teams for the change to micro frontends, as well as how to adjust the user interface (UI) design and your CSS styles 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 strengthen the security level of your micro frontend solution, while reinforcing your overall knowledge with real-world case studies relating to micro frontends. By the end of this book, you'll be able to decide whether and how micro frontends should be implemented to achieve high scalability for your web app.
Alle Preise
Weitere Details
Weitere Ausgaben
Inhalt
- Cover
- Title Page
- Copyright and Credits
- Dedications
- Foreword
- Contributors
- Table of Contents
- Preface
- Part 1: The Hive - Introducing Frontend Modularization
- Chapter 1: Why Micro Frontends?
- Technical requirements
- The evolution of web applications
- Programming the web
- The social web
- The separation of the frontend and the backend
- Everything becomes micro
- From SOA to microservices
- The advantages of microservices
- The disadvantages of microservices
- Micro and frontend
- Emerging web standards
- Isolation via web components
- Frame communication
- Web workers and proxies
- Faster TTM
- Decreasing onboarding time
- Multiple teams
- Isolated features
- A/B testing
- Summary
- Chapter 2: Common Challenges and Pitfalls
- Technical requirements
- Performance
- Resource caching
- Bundle size
- Request optimizations
- Security
- Central user management
- Individual user management
- Script execution
- Knowledge sharing
- Reliability
- User experience
- Wording
- Pattern libraries
- Summary
- Chapter 3: Deployment Scenarios
- Technical requirements
- Central deployments
- Using a monorepo
- Joining multiple repositories
- Distributed deployments
- Using a monorepo
- Using dedicated pipelines
- Hybrid solutions
- Scheduled releases
- Triggering on change
- Summary
- Chapter 4: Domain Decomposition
- Technical requirements
- Principles of DDD
- Modules
- Bounded context
- Context map
- Strategic domain design versus tactical design
- Separation of concerns
- Technical split
- Functional split
- Example decomposition
- Architectural boundaries
- Shared capabilities
- Choosing the right level of freedom
- Accessing the DOM
- Universality of micro frontends
- Summary
- Part 2: Dry Honey - Implementing Micro Frontend Architectures
- Chapter 5: Types of Micro Frontend Architectures
- Technical requirements
- The micro frontend landscape
- Static versus dynamic micro frontends
- Horizontal versus vertical split
- Backend- versus frontend-driven micro frontends
- Summary
- Chapter 6: The Web Approach
- Technical requirements
- Basics of the web approach
- The architecture
- Sample implementation
- Potential enhancements
- Advantages and disadvantages of the web approach
- Using links for navigation
- Central linking directory
- Local linking directory
- Using fragments with iframes
- Security
- Accessibility
- Layout
- Summary
- Chapter 7: Server-Side Composition
- Technical requirements
- Basics of server-side composition
- The architecture
- Sample implementation
- Potential enhancements
- Advantages and disadvantages of server-side composition
- Reviewing Mosaic 9
- Introducing Podium
- Known users
- Creating a composition layout
- Understanding layout responsibilities
- Using SSI
- Using ESI
- Using JS template strings
- Setting up micro frontend projects
- Podlets
- Examining the lifecycle
- Using a dedicated rendering server
- Summary
- Chapter 8: Edge-Side Composition
- Technical requirements
- Basics of edge-side composition
- The architecture
- Sample implementation
- Potential enhancements
- Advantages and disadvantages of edge-side composition
- SSI and ESI
- SSI
- ESI
- Stitching in BFFs
- Summary
- Chapter 9: Client-Side Composition
- Technical requirements
- Basics of client-side composition
- The architecture
- Sample implementation
- Potential enhancements
- Advantages and disadvantages of client-side composition
- Diving into web components
- Understanding web components
- Isolating styles with shadow DOM
- Composing micro frontends dynamically
- Using a micro frontend discovery service
- Updating micro frontends at runtime
- Summary
- Chapter 10: SPA Composition
- Technical requirements
- Basics of SPA composition
- The architecture
- Sample implementation
- Potential enhancements
- Advantages and disadvantages of SPA composition
- Building a core SPA shell
- Activating pages
- Sharing dependencies
- Integrating SPA micro frontends
- Declaring the lifecycle
- Using cross-framework components
- Exploring communication patterns
- Exchanging events
- Sharing data
- Extending components
- Optimizing hydration and progressive rendering
- Summary
- Chapter 11: Siteless UIs
- Technical requirements
- The basics of siteless UIs
- The architecture
- Sample implementation
- Potential enhancements
- Advantages and disadvantages of siteless UIs
- Comparing siteless UIs and serverless
- Developing locally
- Publishing modules
- Creating a siteless UI runtime
- Building a runtime with Piral
- Deploying a runtime with Piral
- Writing siteless UI modules
- Looking at a pilet's life cycle
- Implementing framework-agnostic components
- Implementing islands composition with Qwik
- Summary
- Part 3: Bee Brood - Implementation Details
- Chapter 12: Sharing Dependencies with Module Federation
- Technical requirements
- Sharing dependencies between micro frontends
- Utilizing Module Federation
- Understanding Native Federation
- Achieving independence with SystemJS
- Summary
- Chapter 13: Isolating CSS
- Technical requirements
- Understanding the consequences of open styling
- Implementation techniques to scope CSS
- Using the shadow DOM
- Using modern CSS features for isolation
- Summary
- Chapter 14: Securing the Application
- Technical requirements
- Using web standards to harden security
- Limiting script access
- Verifying authenticity
- Summary
- Chapter 15: Decoupling Using a Discovery Service
- Technical requirements
- Avoiding hidden monoliths
- Implementing a discovery service
- Using advanced capabilities
- Summary
- Part 4: Busy Bees - Scaling Organizations
- Chapter 16: Preparing Teams and Stakeholders
- Technical requirements
- Communicating with C-level stakeholders
- Managing expectations
- Writing executive summaries
- Handling product owners and steering committees
- Team organization
- Understanding possible team setups
- Changing team organizations
- Summary
- Chapter 17: Dependency Management, Governance, and Security
- Technical requirements
- Sharing all or nothing
- What about change management?
- Establishing a governance model
- Sandboxing micro frontends
- General security concerns and mitigations
- Summary
- Chapter 18: Impact of Micro Frontends on UX and Screen Design
- Technical requirements
- Always adding one
- Learning to start at zero
- Sharing designs efficiently
- Creating designs without designers
- Summary
- Chapter 19: Building a Great Developer Experience
- Technical requirements
- Providing a minimum developer experience
- Supporting development in standard IDEs
- Improving the scaffolding experience
- Establishing a decent developer experience
- Centralizing code documentation
- Using videos
- Assisting with code analysis
- Improving testability
- Achieving the best developer experience
- Integrating error codes
- Providing an offline-first development environment
- Customizing via browser extensions
- Implementing a developer portal
- Summary
- Chapter 20: Case Studies
- Technical requirements
- A user-facing portal solution
- Problem description
- Team setup
- Solution
- Impact
- An administration portal solution
- Problem description
- Team setup
- Solution
- Impact
- A healthcare management solution
- Problem description
- Team setup
- Solution
- Impact
- An e-commerce solution
- Problem description
- Team setup
- Solution
- Impact
- An application for mobile banking
- Problem description
- Team setup
- Solution
- Impact
- Summary
- Epilogue
- Index
- Other Books You May Enjoy
Systemvoraussetzungen
Dateiformat: ePUB
Kopierschutz: Adobe-DRM (Digital Rights Management)
Systemvoraussetzungen:
- Computer (Windows; MacOS X; Linux): Installieren Sie bereits vor dem Download die kostenlose Software Adobe Digital Editions (siehe E-Book Hilfe).
- Tablet/Smartphone (Android; iOS): Installieren Sie bereits vor dem Download die kostenlose App Adobe Digital Editions oder die App PocketBook (siehe E-Book Hilfe).
- E-Book-Reader: Bookeen, Kobo, Pocketbook, Sony, Tolino u.v.a.m. (nicht Kindle)
Das Dateiformat ePUB ist sehr gut für Romane und Sachbücher geeignet – also für „fließenden” Text ohne komplexes Layout. Bei E-Readern oder Smartphones passt sich der Zeilen- und Seitenumbruch automatisch den kleinen Displays an.
Mit Adobe-DRM wird hier ein „harter” Kopierschutz verwendet. Wenn die notwendigen Voraussetzungen nicht vorliegen, können Sie das E-Book leider nicht öffnen. Daher müssen Sie bereits vor dem Download Ihre Lese-Hardware vorbereiten.
Bitte beachten Sie: Wir empfehlen Ihnen unbedingt nach Installation der Lese-Software diese mit Ihrer persönlichen Adobe-ID zu autorisieren!
Weitere Informationen finden Sie in unserer E-Book Hilfe.
Dateiformat: ePUB
Kopierschutz: ohne DRM (Digital Rights Management)
Systemvoraussetzungen:
- Computer (Windows; MacOS X; Linux): Verwenden Sie eine Lese-Software, die das Dateiformat ePUB verarbeiten kann: z.B. Adobe Digital Editions oder FBReader – beide kostenlos (siehe E-Book Hilfe).
- Tablet/Smartphone (Android; iOS): Installieren Sie bereits vor dem Download die kostenlose App Adobe Digital Editions oder die App PocketBook (siehe E-Book Hilfe).
- E-Book-Reader: Bookeen, Kobo, Pocketbook, Sony, Tolino u.v.a.m.
Das Dateiformat ePUB ist sehr gut für Romane und Sachbücher geeignet – also für „glatten” Text ohne komplexes Layout. Bei E-Readern oder Smartphones passt sich der Zeilen- und Seitenumbruch automatisch den kleinen Displays an.
Ein Kopierschutz bzw. Digital Rights Management wird bei diesem E-Book nicht eingesetzt.
Weitere Informationen finden Sie in unserer E-Book Hilfe.