The Art of Micro Frontends: Build Highly Scalable, Distributed Web Applications with Multiple Teams, 2nd Edition

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