Developing a Management Console for Cybersecurity Protection

Project Goals

Webmonitorx provides cybersecurity solutions for leading financial institutions, payment systems, e-commerce platforms, and high-load web applications, protecting them from cyberattacks, data breaches, and unauthorized access. The company’s product portfolio, integrated into a unified security platform, includes:

• ProWAF (Web Application Firewall)
• ProAPI Security Suite, which consists of:
  • Structure (API architecture validation)
  • Testing (API security testing)
  • Protection (Real-time API threat mitigation)

To accelerate the development of its API security management system, Webmonitorx outsourced development to Evrone, allowing its internal team to focus on core cybersecurity technology. Additionally, the existing design system required a UX/UI refresh.

Evrone was tasked with building the management console, which would not only handle security policy management but also visualize system data through tables and charts. Our joint objective with the Webmonitorx team was to deliver an MVP version for business validation and testing.

Evrone follows a smart outsourcing model, integrating into client teams while maintaining autonomy in execution—this project was no exception.

Technology Stack Selection

The primary development language chosen for the project was Go, as it is the core technology for Webmonitorx's ProAPI product line. For data storage, the team selected MongoDB due to its ability to meet specific requirements. Apart from handling standard business entity storage, the system needed to store service events—all API requests that failed validation. These events must be saved, retrieved, sorted, and efficiently searched, as they play a crucial role in real-time monitoring dashboards.

On the frontend, we used React, and at the client’s request, integrated Recharts for data visualization, as this library was already in use across other projects. For UI components, we chose shadcn/ui, which enables importing component source code directly via the CLI, offering greater flexibility in customizing unstyled elements.

Management Console & User Interaction

The management interface can be accessed both through a graphical UI and via a command-line console that processes predefined commands and filters before sending them to the backend. The key challenge was synchronizing console commands with filter presets, ensuring that selected filters were reflected in the console and vice versa.

Beyond standard query commands, the console supports natural language input, such as "last five days", to retrieve recent system events dynamically.

Webmonitorx products use a unified query language across their ecosystem, so we designed our implementation to be fully compatible with their existing infrastructure. This query system is based on logical constructs that convert into database queries, allowing users to filter security events through text-based commands or UI-driven selections.

System Integration & High-Load Handling

The management console and security system needed to support both synchronous and asynchronous interactions. Typically, high-load applications utilize a message broker (a queue that manages real-time communication between services). However, deploying this additional infrastructure would have significantly increased complexity.

Since the primary goal was to deliver a functioning MVP, we decided to defer implementing full-scale asynchronous messaging while laying the groundwork for future integration if needed. This approach ensures that if the client continues product development, transitioning to a more scalable model will be seamless.

UI/UX Redesign & Customization

Although Webmonitorx already had a working product with a design system, it lacked functional UI components necessary for an advanced management console. Many interface elements had evolved organically over time and required visual simplification and modernization.

Our design team focused on:

• Streamlining complex interface components following best practices
• Refining text descriptions for clarity
• Standardizing spacing and sizing across all UI components
• Maintaining continuity with familiar elements to avoid disrupting user habits

Since Webmonitorx is an analytical system, its primary interface elements include tables, charts, and forms. Given our extensive experience in data-heavy interfaces, we quickly customized UI components to fit the client's needs while ensuring all edge cases were handled.

We redesigned key sections, including:

• Dashboard summary
• Connected applications list
• Node management
• Settings panel
• Event logs with filtering

These updated UI components serve as building blocks for future enhancements, allowing for expansion while maintaining design consistency. 

Project Outcome & Future Prospects

Working closely with Webmonitorx, Evrone developed a powerful management system that enables real-time API security monitoring, data collection, and visual representation through custom-built dashboards and tables. Instead of relying on third-party tools like Grafana, we created a bespoke metrics collection system capable of visualizing security data, aggregating logs, and filtering information.

On the frontend, we focused on developing unique UI components rather than relying on pre-existing solutions, ensuring a highly customized user experience.

We followed a clean architecture approach, segmenting the software into modular functional components that interact only as needed and through defined protocols. This reduces dependencies, making the system easier to maintain and ensuring that future enhancements—such as an SDK for client-server communication—can be integrated smoothly.

At the time of publication, the project is ready for deployment, with the client managing the final launch process.

Let’s Build Your Next Security Solution Together

Evrone specializes in developing high-load security solutions, whether as an independent team or as part of the client’s development process. If you need a custom cybersecurity management system, fill out the form below to discuss collaboration opportunities.