Transforming Legacy Systems and Team Culture
Battleface Frontend Modernization
Overview
Inherited a legacy Angular application with massive tech debt, frequent production issues, and teams stepping on each other. Modernized the tech stack through microfrontends with Webpack Module Federation in an Nx monorepo, enacted deployment processes, added no-code E2E tests, and streamlined project management.
The Challenge
Battleface was stuck on an outdated Angular version with accumulated technical debt causing frequent production issues. Multiple development teams worked in the same codebase without clear boundaries, constantly creating merge conflicts and stepping on each other's work. Project management was chaotic with inaccurate estimates and misaligned expectations between engineering, product, and design.
The Approach
- 1
Audited existing codebase and deployment processes to identify highest-impact improvements
- 2
Enacted formal production deployment process with staging environments and release checklists
- 3
Introduced no-code E2E testing framework and onboarded product and QA teams to create tests themselves
- 4
Architected migration strategy using microfrontends with Webpack Module Federation
- 5
Set up Nx monorepo to manage multiple frontend applications with shared libraries
- 6
Taught product and design teams agile methodologies and estimation techniques
- 7
Established cross-functional communication rituals to align expectations early
The Results
Production incidents decreased by 70% within first quarter of new deployment process
Product and QA teams created comprehensive E2E test suite without engineering bottleneck
Successfully migrated off legacy Angular app to modern microfrontend architecture
Multiple teams could work independently without merge conflicts or coordination overhead
Estimate accuracy improved dramatically, rebuilding trust between engineering and stakeholders
Shared component library ensured consistent UX across all frontend applications
Engineering team morale increased significantly with reduced firefighting and clearer processes
The Impact
The Battleface modernization proved that technical and organizational problems are deeply intertwined. By addressing processes, communication, and architecture simultaneously, we transformed a chaotic environment into a sustainable, scalable development organization.