Frontend development of a custom system for the customer’s specific business needs

Provided services

Frontend Development

Client

A company engaged in the translation and localization of games, applications, and websites.

Product

An equivalent of Google spreadsheets designed for the systematic management of the company’s processes.

Business challenge

All the company’s documentation and processes are stored in Google services, but the existing capabilities do not allow them to quickly and conveniently solve the necessary tasks and store a large amount of data. Also, Google services do not provide complete security and confidentiality of stored information. Therefore, the customer needed to develop a custom web application that’s convenient to use for solving specific tasks (translation processes management), and help to optimize routine actions.

Technological features of the project

  • The web application included some of the most complex components that JazzTeam have ever developed. It supported all the functionality of Google spreadsheets, as well as customer-specific functions.
  • In the course of development, special attention was paid to cross-browser and cross-platform compatibility.
  • When working on the task, it was necessary to continuously conduct various studies. For example, it was necessary to study rarely used CSS features.
  • The development was based on the existing architecture and the small codebase prepared by the customer’s team.
Frontend development of a custom system for the customer's specific business needs
Block diagram: Frontend development of a custom system for the customer's specific business needs

Approaches and solutions

  • Development of a spreadsheet component that can be easily customized and developed for the desired tasks. In a short time, our developers prepared the spreadsheet architecture, which included the following functionalities:
  • Display, easy reading, editing, deleting, and processing a large amount of data;
  • Automatic calculation of fields on the server side;
  • Sending emails to customers from the app.
  • Creation of the custom mail editor interface using the Draft.JS framework. It was necessary to ensure complete freedom of styling, expansion, and customization of the text, which required the use of a lower-level tool. We did some research in order to find the most optimal option, and priority was given to the Draft.JS framework. This solution provides opportunities for inline text styling, adding links, and creating an image slider.
  • Establishing the unified project code style and optimizing the application performance to ensure easy further development of the system. In addition to development, we were involved in the long-term support and development of an essential component of the system.

Results and achievements

  • The web component of the system was successfully implemented. The application is actively used by the customer’s team and ensures fast, convenient work with the necessary tasks.
  • The research on selecting the optimal framework for editing email texts was successfully performed.
  • Virtualization of the web application was implemented, which made it possible to store a large amount of data within a single page.
  • A database of components for re-use and quick updating of other sections of the application, as well as other projects of the customer, was developed.
  • Effective work according to the Scrum methodology, with frequent deliveries and daily customer feedback, was established on the project, which made it possible to complete a large amount of work in a short period of time and meet all the customer’s requirements.

Technologies used

tech picture
JavaScript ES6
tech picture
React
tech picture
Redux
tech picture
Draft.js
tech picture
HTML
tech picture
CSS3
tech picture
Redux-Thunk
tech picture
WebSocket
tech picture
gRPC
tech picture
NPM
tech picture
WebPack

    Contact Us

    What happens next?
    1
    Leave your project request. We will contact you and schedule a call.
    2
    Signing of the NDA to ensure the project info confidentiality.
    3
    Negotiation of your request and the required services.
    4
    Team forming, coordination of workstages.
    5
    Contract signing and project start.