Web Application Builder
Web Application Builder
Information
Region:
Germany and worldwide
Industry:
Commerce and Shopping, HR and Recruiting, Logistics and Transportation, Real Estate
Type:
Web
Engagement model:
Time and materials
Duration:
Three years
Staff:
Three mid-to-high-level JavaScript developers
Technologies used
Azure Kubernetes
Java
Saga
Azure VMs
Redux
Ajv
Ubuntu
Nest.js
TinyMCE
React
MongoDB
TypeScript

Challenge

The client has been helping businesses adopt Microsoft software for more than 25 years. Over time, they have built a hefty customer base and accumulated a lot of data. This required a powerful digital platform to keep processes running smoothly.

With that in mind, the company tried to build a platform using TypeScript. But they soon realized their developers couldn’t build a complex web application like that on their own.

At that time, we already had a lot of experience with React and TypeScript. That was easy to prove, and the company eventually hired us for the job.

Solution

The early attempts the company had undertaken to put together an application had resulted in a non-reusable web page. Therefore, Elinext had to develop the software from the ground up.

The client didn’t want just a one-purpose application. In essence, they wanted a customizable, reusable core, or a web application builder.

However, the client didn’t have a complete vision of the product from the beginning. We had to put bits of requirements together and develop them into product specifications we could work on. The Agile approach proved itself especially useful. Our team frequently got on calls with the client, built the product piece by piece, gathered user feedback and acted on it.

There was a decent back end, and our task was to build a front end using React to connect with it. In addition, we developed a new back end for storing data. That resulted in three major components: Data Service, Meta Service and Platform App.

Data Service

The Data Service is a back-end component responsible for storing data in Mongo DB. An administrator can use this service to manage data across several endpoints. We set up a user authentication system to check access rights and prevent unauthorized users from managing data.

The Data Service interface supports multiple languages.

Meta Service

A lot of data can be stored with the Data Service, but you can’t use it until it’s organized and displayed properly. And that is why we set up another back end component: the Meta Service.

The Meta Service contains rules for data display such as data types, item fields, user actions and other. It uses JSON Schema to describe data.

Another job for this component is integrity checks. The Meta Service validates data to ensure it’s stored in a consistent and secure manner.

Generic App

The frontend component we’ve built is called the Generic App. The services do most of their job behind the curtains and are only available to system admins, while the app is a regular user’s workspace.

Within the app, users can view and manage different items to the extent set up by the administrator. Those items may include invoices, projects, subscriptions or other types. A user can create an item from a preset form. Each item type has a specific form, as configured with the Meta Service, and data stored with the Data Service.

The form may include fields like text, date, file uploads and drop-down menus. If the item is a sub-user profile, the user can set up permissions, the data to be displayed on the sub-user’s profile, roles, visual customizations, sources to pull data from and more.

We made the user experience as smooth as possible. For example, when a user is modifying an item’s data, the page does not reload to save changes. We also configured user authentication through Microsoft SSO, allowing sign-ins via Google, LinkedIn, Microsoft and other popular platforms.

Furthermore, users can choose between the light and dark interface themes, display alternate table rows in tables and switch to a horizontal menu. And if a person is using the application for the first time, they can use the Take a Tour mode where they’re shown tips on the interface features.

Result

We’ve developed a powerful application builder for the client. They can use it to create all kinds of applications, from a simple website to warehouse management software. There is likely no area of business that can’t be digitized using this application.

After three years, the project is coming to an end. We’re polishing it by drawing on user feedback as the client keeps discovering its huge potential.

cosmo-1
cosmo-2
cosmo-3
cosmo-4
cosmo-5
cosmo-6
cosmo-7-2
Do you want the same project?
Got A Project Idea? Lets Discuss It With Us
Contact Us