Webscope.io Logo

Refactoring Hazelcast Management Center's large code-base

Client
Hazelcast
Services we provide
Modernization, Custom UI/UX Design
Industry
Cloud Infrastructure

Webscope collaborated with Hazelcast to develop a modern frontend for their cloud-native management center—a complex application that helps engineering teams monitor and manage in-memory data clusters in real time.

1 year

To migrate a large-scale code base to the SotA solution

~1300 tests

to date

60%

Test coverage

Issues and solutions

Goal was to iteratively refactor the existing code-base from jQuery to a stack that is easy to maintain while improving overall UX.

Front-end expertize

The project required frontend expertise to deliver a responsive and intuitive UI for monitoring, configuring, and managing real-time data infrastructure.

Iterative roadmap

Project had to still allow a timely delivery of new features

Analysis

We did a thorough analysis of the jQuery stack that revealed that the code-base was large and the code-style was generally imperative.

Since we needed technologies that would enable us an incremental refactoring approach, we chose React, Redux and RxJS as the core technologies to build on, while incrementally integrating TypeScript.

We have continued extending the project by adding new features ever since while also focusing to improve the test coverage greatly.

We managed to migrate the whole code-base within one year.

About Hazelcast

How we delivered

Reusable Components

Built scalable, modular components using Tailwind CSS to streamline new feature delivery

Design Implementation

Translated complex product requirements into clean, intuitive interfaces

Embedded our team into Hazelcast’s agile workflows for a tight coordination with Hazelcast's backend engineers.

Written tests to make sure the application is stable and our changes won't break existing functionality.

Maintained high code quality and detailed documentation

Technologies

Modern stack with scalable components system


ReactJS

Typescript icon

TypeScript

Figma

Tailwind css logo

Tailwind CSS

conversation bubbles

Discover your roadmap to healthier software

Looking to solve similar challenges?

Quotes icon

Modernizing our code-base was not an easy task as we also needed to make our customers happy at the same time, adding new features or fixing existing bugs. I’m happy to say that we accomplished what we set out to do, thanks to the hard work of developers at Webscope.io.

Emre AydınHazelcast Team Lead, Hazelcast