The Ubex project is rapidly advancing towards full operational capacity and is preparing for the launch of several key modules in the near future. In the given article, we would like to describe the operation of the interface stack and the main library of operations with the server.
In / Out
The process of rendering html scripts is an important part of any web interface. For the html render, the Ubex project has opted for the Javascript framework from Facebook, which is called React. To date, React has managed to attract a considerable share of the client application development market, a fact, which is clearly demonstrated by the following graph: https://www.hntrends.com/2018/jun-no-signs-of-slowing-for-react.html?compare1=React&compare2=AngularJS&compare3=Angular+2&compare4=Vue
In the opinion of the Ubex development team, the main reason for the growing popularity of React is its approach to application programming, in which applications have the appearance of independent components with strictly defined tasks and interfaces. The application is assembled by analogy with LEGO blocks. But, in addition to the millions of details written by other developers, those seeking to develop something new can always create their own constructs. This approach allows users of React to create applications that are both flexible and easy to maintain, thus allowing the developers to adapt their apps to rapidly changing business tasks.
The main components of the applications can contain other components, which are called higher order components. For example, the personal account on the Ubex platform has 4 sections: the Trading Desk, Data Marketing, the Ad Network, and Data Mining. Each section is a higher order component that contains its own set of components, which, in turn, consist of smaller components, such as buttons, input fields and other segments. Within the process of building the application, it is the developers who indicate which partition should be in the bundle.
Data Store
Since the Ubex platform deals with immense amounts of data, the need for a convenient and readily available storage module arises naturally. The Redux library is used within the Ubex project for storage and organization of work with data in conjunction with React.
Redux is a repository and the underlying methods for changing the provided data, which are described in special functions, or the reducers. The components of React are subscribed to the changes in the repository and update the html code on the page in accordance with the changes in the data. A request to change the data within the repository can be triggered by the user through an interface component by initiating an action, or in response to some action initiated by the application itself. For example, the completion of data transfer from the server is one such action. An additional advantage of this approach is that the developers can look at the history of all the initiated actions and changes in the repository, and revert the state of the repository backward or forward. This greatly simplifies debugging of the application. An additional advantage is that the Redux-logger library outputs all actions directly to the Javascript console.
Sagas
The request of data from the server is an asynchronous call. That is, it takes some time to establish a connection and transfer the necessary data. In addition, there is the possibility that the server will not respond in time, or some kind of network failure may occur. As a consequence, the request will fail and the user must be notified of such failure. As such, seeing notifications of such failures is a vital element of troubleshooting.
All of the issues described above are easily solved by the Redux-Saga library. The principle of operation of the library is as follows: the Saga subscribes to certain events, makes an asynchronous call and generates an event corresponding to the result with data obtained during the execution of the call.
Collection Helper
Usually, the process of working with the server API is reduced to working with lists of business objects that have similar behavior. Programmers call such lists “collections” if the API has read and write access (add, edit, delete a collection object), or “normal lists” if there is only read access. To work with collections, a small library was written in the form of a set of functions that implements the low-level logic of synchronizing server data with storage.
The Ubex platform is a highly complex and advanced system in which the multitude of modules work harmoniously to ensure the end goal of unprecedented accuracy of targeting. A variety of processes underlie the display of ads to end users and the Ubex development team seeks to apply only the best and proven world-class practices to ensure impeccable operation. Stay tuned for more news and updates from Ubex.
