Making the move to an open-source framework for Chase.com

By: Juan Wang, Head of Secure Web Channel for Chase

Chase.com is the award-winning digital front door for Chase. It serves more than 80 million customers across Chase businesses, and every month millions of those customers log in to view account balances, pay bills, apply for credit cards, manage investments, apply for home and car loans, use rewards, book travel, and “zelle” friends.

Behind the scenes, more than 1,000 software engineers work together to continuously deliver high-quality features and enhancements with the goal of helping customers manage their financial lives on any device anytime, anywhere.

Previously, the site operated on a monolithic architecture written in a proprietary web framework, which slowed down and limited our team’s ability to deliver enhancements. Our features were tightly coupled and deployed to production as a single application.

The monolithic architecture also created significant cross-team dependencies, requiring more complex and time-consuming development, testing and deployment coordination. Any single feature change required deploying an entire application, and if one feature failed, it compromised the entire build.

It was also becoming increasingly difficult to keep pace with rapidly evolving browser capabilities and advancements. This also made it more difficult to attract and retain talent because it created a steep learning curve for new and internal hires.

At the time, open-source web frameworks were not mature, so to achieve our goals, our team built a proprietary web stack. A relatively small internal team maintained our custom-made framework that was built with stability as a priority.

As the site matured and now provided richer customer experiences, we needed technologies and an approach that enabled independent, distributed development to deliver a consistent, secure, fast and easy to use session to each user.

Our solution was to modernize our web framework to address these limitations. Our first step was deciding on an ecosystem that addressed the limitations, but also was one that top developer talent wanted to work in. We needed a standard, modern web framework all teams could leverage to build highly scalable, enterprise-grade web applications in a consistent manner that delivered compelling features to our customers, faster. That’s why the team chose to adopt React, due to its popularity and flexibility, as well as a micro front-end architecture and component-driven development methodologies.

Our current developers and those we want to attract to Chase know it and they want to work in it. It was and is a win-win.

At the same time, we recognized that scrapping the old framework altogether was not feasible — the two frameworks would need to live alongside one another during a transition period to achieve our goals. This was a great opportunity for our teams to flex their engineering muscles to build and deploy the new framework in parallel with the old — another win. We were hyper focused on our customers and making sure the transition was seamless.

Today, our new web stack includes more than 30 industry-leading, open-source frameworks and libraries, and special libraries for enterprise integration. Its components were selected and configured for speed at scale by enabling a loosely coupled micro-frontend architecture.

Features can be developed, tested, and deployed as independent applications, while still ensuring a seamless, consistent customer experience with industry-leading security, stability, and performance. And by working more autonomously, feature teams can more effectively perform component-level testing with “shift left” best practices, to deliver enterprise-grade code to production anytime and with confidence. Its components are also pre-configured for our needs, minimizing setup time so engineers can better focus on feature development and user experience optimization.

Our new framework empowers our teams by supporting learning journeys, engineering handbooks, videos, office hours, and community rooms to help engineers learn, upskill and adopt.

Working together, the framework’s components enable teams across our firm to drive speed at scale to deliver better experiences for our employees and customers.

Finally, our new open-source web stack accelerates the hiring and onboarding process. Top software engineering talent is usually more attracted to jobs that leverage industry-leading frameworks and libraries, which they can now find at Chase.

As web technologies continue to evolve, our open-source web development stack will also evolve, absorbing the best technology advancements from across multiple industries. And as all teams across Chase adopt it as our standard web stack, their practices and learnings will also contribute to its capabilities, continuously making it easier for them to create delightful experiences that our customers love.

A special thanks to my team, and more specifically Jeffrey Rose and Marwan Saleh for contributing to this post.

Like what you’re reading? Check out all our opportunities in tech here.

JPMorgan Chase is an Equal Opportunity Employer, including Disability/Veterans

For Informational/Educational Purposes Only: The opinions expressed in this article may differ from other employees and departments of JPMorgan Chase & Co. Opinions and strategies described may not be appropriate for everyone and are not intended as specific advice/recommendation for any individual. You should carefully consider your needs and objectives before making any decisions and consult the appropriate professional(s). Outlooks and past performance are not guarantees of future results.

Any mentions of third-party trademarks, brand names, products and services are for referential purposes only and any mention thereof is not meant to imply any sponsorship, endorsement, or affiliation.