You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: apps/website/src/content/posts/how-we-rebuilt-a-legacy-ui-with-zero-downtime.md
+13-6Lines changed: 13 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
---
2
-
title: "How We Rebuilt a Legacy UI With Zero Downtime: A Case Study in Component Libraries and Frontend Governance"
3
-
description: "Find out how we embedded within frontend teams to lead a zero-downtime UI migration from the inside. This case study explores our bottom-up approach to migrations using early governance to create a shared component library."
2
+
title: "How We Rebuilt a Legacy UI With Zero Downtime: A Case Study in Component Libraries and Frontend Guidance"
3
+
description: "Find out how we embedded within frontend teams to lead a zero-downtime UI migration from the inside. This case study explores our bottom-up approach to migrations providing early guidance to create a shared component library."
4
4
createdAt: 1754640512840
5
5
updatedAt: 1754640512840
6
6
authors: ["gloria"]
@@ -46,9 +46,7 @@ To embed migration into the existing codebase, we built seamless bridges between
💡 If you are interested in how we handle framework migrations, you can read about our experience migrating from Angular to React at <strong>sevdesk</strong>:
“How We Migrated an Enterprise App from AngularJS to React Without Downtime”
51
-
</a>.
49
+
<a href="/blog/migrating-an-enterprise-app-from-angularjs-to-react" target="_blank" rel="noopener noreferrer">“Migrating an Enterprise App from AngularJS to React”</a>.
52
50
</p>
53
51
</blockquote>
54
52
@@ -81,6 +79,15 @@ At Mister Spex, the process looked somewhat different. We built a component libr
81
79
82
80
Before this, duplication was commonplace: similar UI elements were implemented in slightly different ways across teams. The new library gave them a consistent foundation to build on, improving alignment and reducing rework.
83
81
82
+
<blockquote>
83
+
<div>
84
+
<p>The list of things I could praise about Danica’s work at Searchmetrics is not short. She took apart the whole design system to recreate it as an interactive component library—something we would never have time for among all the product features and improvements. And the outcome was outstanding: consistent, easy to use, and well documented. And on top of all that, it was always a joy to work with her.</p>
85
+
</div>
86
+
<pstyle="quotes: none; font-style: normal;">
87
+
— Sarah Wachs, Senior Developer and Former Chapter Lead at Searchmetrics
88
+
</p>
89
+
</blockquote>
90
+
84
91
---
85
92
86
93
## Long-Term Impact
@@ -98,7 +105,7 @@ We’ve experienced firsthand that **zero-downtime migrations are possible**, bu
98
105
Here’s what worked for us:
99
106
100
107
-**Don’t pause delivery.** Integrate migration into the roadmap for better quality and long-term stability.
101
-
-**Introduce team governance early.** A shared library is only as strong as the practices and people around it.
108
+
-**Introduce team alignment early.** A shared library is only as strong as the practices and people around it.
102
109
-**Build in layers.** Use hybrid patterns, wrapper bridges, and feature flags to avoid big-bang cutovers.
103
110
-**Embed in the team.** Real change happens when you’re part of the chapter, not an external advisor.
0 commit comments