Front-end development has never been so complex and exciting as it is today. New tools and frameworks emerge time after time. That’s why adopting a modern technology stack becomes essential for any organization embracing the digital transformation journey. The front-end app modernization is a core requirement as customers demand high performing and well-designed user interfaces.
These modern technologies give developers the flexibility to finely tailor the ecosystem. For the experienced front-end architects this kind of freedom means preventing vendor lock-in.
Our clients have migrated their front-end technology for a few reasons with the main ones being:
- Their legacy app didn’t have the capabilities to support modern browser features and rich user interfaces.
- Domain knowledge of the applications went away when their developers departed their organization, causing a significant loss of know-how.
- Feature bloat, technical debt, and dependencies of libraries and frameworks that are difficult to maintain.
Here are few examples of front-end app modernization projects with React that we executed for clients across the globe:
Financial analytics solution for an investment company in the USA
To serve the diverse information needs of this investor base and its internal users, the firm offers a solution which presents a comprehensive overview of all assets under management, in the form of detailed financial dashboards. Consisting of tables, charts and other visual collateral, these dashboards harness thousands of data series to depict a multitude of metrics and scenarios.
The goal of the client was to improve user experience and thus, customers’ feedback. Applying a front-end first approach to modernization, we provided a redesign of the current dashboard system, reducing the amount of duplication characteristic to the current system, optimizing the solution’s front-end architecture, and enhancing the user experience through options for tailoring base widgets, according to users’ specific need. Reducing performance and stability issues, caused by strained technologies, was tackled by rewriting the solution’s front-end with React.
Social Business Software for one of the fastest-growing technology startups in Europe
The main goal of the project was to build a new vision as the client acquired another company and wanted to combine all its products into one single solution. Therefore, we supported the implementation of the entire rebranding. Until that point, the different solutions were written in different technologies with some using ASP.NET and Razor view, others Angular, and third React. Therefore, to achieve unification, a single framework had to be chosen for all products. We decided to go with React because it is easier to introduce to new developers and offers more flexibility. This compensated the time spent on rewriting the code, so the final product provided quality and innovation. Furthermore, along with modernizing the front-end, the back-end оf the solution was also refactored, which brought the introduction of GraphQL. Therefore, the supporting libraries fit the combination perfectly. As a result, 6 products were combined into one, while the rest were also rewritten with React and used a common internal library of components that create a sense of integrity and unity between the individual software solutions.
Microfinance Platform for one of the biggest banks in South Africa
To speed the loan approval process and enable customers to quickly find practical information about short-term credits and estimate interest rates, the bank needed to modernize its legacy solution. Therefore, the project focused on changing the main web application from a gigantic jQuery monolithic structure to a more modular and service-oriented application. We introduced ES6 with React and more modularity and removed the dependency of jQuery in the future. Since we couldn’t replace the whole application, we needed to have a gradual approach. As a result, all the dynamic parts of the app, such as filters, search results, interest grids, etc. were replaced with React. Furthermore, everything in the front-end was in sync with a global front-end application state with the help of Redux which made it possible to slowly migrate to a newer stack in the front-end.
To wrap up
Transitioning from outdated front-end technologies to modern ones is both exciting and challenging. It requires understanding client’s long-term goals and selecting the right tools and processes according to your business requirements. A front-end-first approach is one way to look at modernization that may fit your need. It shows results instantly, reduces risk, and helps you get a better understanding of the bigger picture.