Overview

Led the implementation of a Micro Frontend architecture for Wing's Finance Hub Portal, enabling multiple teams to ship independently while maintaining a coherent end-user experience.

Highlights

• Micro Frontend rollout: used Webpack Module Federation to split the portal into independently deployable apps, reducing cross-team dependencies.
• Domain-driven boundaries: defined architectural boundaries between domains so each team owned a clear slice of the product, end to end.
• Standards & mentorship: standardized frontend best practices across teams and mentored developers in DDD, modular architecture, and cross-team collaboration.

Technologies

• Frontend: React, TypeScript
• Build & integration: Module Federation, Vite
• Styling: Tailwind CSS

Security & best practices

A financial portal with multiple teams shipping into the same shell needs security baked into the architecture itself, not bolted on per team.

• Centralized authentication: auth and session management owned at the host level so individual remotes shared a consistent security boundary without each implementing their own.
• Content Security Policy: CSP headers configured at the shell level to control what each remote could load, reducing the cross-team attack surface.
• Shared dependency governance: critical libraries pinned and shared to avoid duplicate versions and dependency sprawl across the federation.
• Standards across teams: frontend security practices documented and enforced through code reviews and linting rather than left to each team to interpret independently.

Outcome

Teams could deploy their slices autonomously, and the portal scaled across domains without turning into a monolith — delivered alongside a clearer shared architecture playbook for new engineers.