Micro Frontends in Action
Michael Geers
  • MEAP began July 2019
  • Publication in Spring 2020 (estimated)
  • ISBN 9781617296871
  • 350 pages (estimated)
  • printed in black & white

An excellent starting point to understand how to introduce micro frontends in your projects.

Potito Coluccelli
Browser-based software can quickly become complex and difficult to maintain, especially when it’s implemented as a large single page application. By adopting the micro frontends approach and designing your web apps as systems of features, you can deliver faster feature development, easier upgrades, and pick and choose the technology you use in your stack. Micro Frontends in Action is your guide to simplifying unwieldy frontends by composing them from small, well-defined units.
Table of Contents detailed table of contents

Part 1: First steps with micro frontends

1 What Are Micro Frontends?

1.1 The Big Picture

1.1.1 Systems & Teams

1.1.2 The Frontend

1.1.3 Integration

1.1.4 Shared Topics

1.2 What problems do Micro Frontends solve?

1.2.1 Faster feature development

1.2.2 No more frontend monolith

1.2.3 Be able to keep changing

1.2.4 The benefits of independence

1.2.5 The downsides of micro frontends

1.3 When do micro frontends make sense?

1.3.1 Good for medium to large projects

1.3.2 Works best on the web

1.3.3 Productivity vs. overhead

1.4 Who uses micro frontends?

1.4.1 Where micro frontends are not a great fit

1.5 The scope of this book

1.6 Summary

2 Loosely Coupled

2.1 Introducing The Tractor Store

2.1.1 Getting started

2.1.2 This books example code

2.2.1 How to do it

2.2.2 Dealing with changing URLs

2.2.3 The benefits

2.2.4 The drawbacks

2.3 Integration via iframe

2.3.1 How to do it

2.3.2 Layout coupling

2.3.3 Interactions

2.3.4 Error scenarios

2.3.5 The drawbacks

2.3.6 When do iframes make sense?

2.4 Summary

Part 2: Micro frontend integrations

3 Deeper Integration

3.1 Integrating via AJAX

3.1.1 How to do it

3.1.2 Not self-contained

3.1.3 Scoping styles and scripts

3.1.4 Progressive enhancement

3.1.5 Declarative loading with h-include

3.1.6 The benefits

3.1.7 The drawbacks

3.1.8 When does an AJAX integration make sense?

3.1.9 Summary

3.2 Routing via a shared web-server

3.2.1 How to do it

3.2.2 Request routing

3.2.3 Route configuration methods

3.2.4 Infrastructure Ownership

3.2.5 When does it make sense?

3.3 Summary

4 Server-Side Integrations

5 Client-Side Integrations

6 Integrating Pages

Part 3: Real-world micro frontends

7 Performance Is Key

8 Coherent User Interface

9 Migration Strategies

10 Integration Testing

11 Inside the Organization

About the Technology

Gone are the days of web UI being simply built with HTML and CSS. Modern web frontends are complex and require the same care in design and implementation as back-end services. The micro frontends approach tackles those issues by extending the principles of microservices to frontend development. With micro frontends different teams can work effectively on a large software system. The application is divided into multiple independent slices — from the database right up to the UI. These different frontends are then integrated using standards such as web components into a single user-facing frontend. Thanks to the smaller scope of a micro frontend, teams can then deliver features faster, upgrade more easily, and make their own choices about their technology stack so they’re always using the right tool for the job.

About the book

Micro Frontends in Action teaches you how to put the theory of micro frontends into practice. Frontend expert Michael Geers teaches you with a complete ecommerce example application that illustrates how a large-scale business application can adopt the micro frontends approach. You’ll learn to integrate web applications made up of smaller fragments using tools such as web components or server side includes, how to solve the organizational challenges of micro frontends, and how to create a design system that ensures an end user gets a consistent look and feel for your application. When you’re done, you’ll be able to better distribute your team’s skills and resources to deliver quality software quickly and flexibly.

What's inside

  • Applying integration strategies with iframes, AJAX, server-side includes, web components and the app-shell approach
  • Optimizing for performance and asset delivery strategies
  • Designing coherent user interfaces
  • Migrating to a micro frontends architecture

About the reader

For intermediate web developers, team leaders, and software architects.

About the author

Michael Geers is a software developer specializing in building user interfaces. He has written software for the web since he was a teenager. In the last few years, he has worked on various customer projects with verticalized architectures. He shares his experiences on this topic at international conferences, in a series of magazine articles, and runs the site micro-frontends.org.

Manning Early Access Program (MEAP) Read chapters as they are written, get the finished eBook as soon as it’s ready, and receive the pBook long before it's in bookstores.
MEAP combo $49.99 pBook + eBook + liveBook
MEAP eBook $39.99 pdf + ePub + kindle + liveBook

placing your order...

Don't refresh or navigate away from the page.

FREE domestic shipping on three or more pBooks