Frontend engineering for ABB: the ELCP dashboard in Angular, a reusable component library documented in Storybook, and breaking a monolith into single-spa micro-frontends.
L&T Technology Services builds engineering software for industrial clients. For ABB I worked on ELCP, a dashboard that had to present a lot of operational data clearly — many kinds of charts and tables on one screen — and it was one part of a larger application that several teams were building into at the same time.
Widgets had to be reusable across the dashboard and beyond it, not rebuilt for each screen, and the application had grown large enough that one team's change shouldn't force everyone to rebuild and redeploy together.
I built the ELCP dashboard in Angular as a set of widgets (different chart types and tables) designed to be modular and plug-and-play, so a widget could be dropped into a page and configured rather than rewritten. From the patterns that kept repeating I built a UI component library, in the spirit of Material UI, that other websites in the org could reuse, and documented every component in Storybook so teams could see how each one looked and behaved without reading the source. On the architecture side I helped break the monolith into several micro-frontends with single-spa, wiring up the routing and the communication between them so they ran together as one app.
ABB's ELCP dashboard, a shared component library other teams build on, and an application split into independently deployable micro-frontends, with every component documented in Storybook so it's easy to adopt.
Built the ELCP dashboard for ABB in Angular: a screen of operational data presented through widgets (a range of chart types and tables), each one modular and plug-and-play so it could be placed and configured on a page instead of rebuilt every time.
A UI component library in the spirit of Material UI, built from the patterns that kept recurring, so other websites across the org could reuse the same components instead of reinventing them.
Documented every component in Storybook, with its states and variations, so other teams could see how a component looked and behaved and adopt it without reading the source.
Helped break a large application into several micro-frontends using single-spa, and set up the routing and communication between them so independently built pieces ran together as one app.