PSI - Issue 44

Gianluca Costantino et al. / Procedia Structural Integrity 44 (2023) 1220–1227 Gianluca Costantino et al. / Structural Integrity Procedia 00 (2022) 000 – 000

1223

4

3.1. Architecture of the web application Web applications are based on a client-server architecture (Fig. 2): the client, running on the browser of the user, has the task of acquiring and displaying information, using the available commands; the server is usually different from the device of the user, processes the input data and provides the client with the required data, formatted in JavaScript Object Notation (JSON) format. The web approach has significant advantages: • there is no need to install software locally, with all the problems of hardware and software incompatibility that this might entail; • the web approach allows the development and maintenance of a single version of the software; • users access the software from any device, everywhere in the world, as long as they have an internet connection: most web applications offer authentication features, allowing access to personal data and settings once logged in; • execution of any processing can be carried out on the server hardware instead of on the user’s device .

Fig. 2. Client-Server architecture (wikipedia.org)

In the proposed web application, the client-side is a HTML5/CSS/JavaScript front-end organized in several reusable components designed in a responsive way to adapt the view at the most popular devices. Bridge data stock is collected in a tree-view, with folders that indicate the road network and contain each single artwork; the same data stock can be displayed in a map-view (Fig. 3a). Data for each bridge are organized following the scheme of Guidelines, thus for each level a group of forms is available (Fig. 3b). The GUI allows the user to check each single datum, which can be easily created, read, updated or deleted. All data are stored on server-side, where a Content Management System (CSM), written in PHP and based on a MySQL relational database, works as back-end. The communications and mutual exchange of data between client and server take place through an APIs system. Therefore, referring to each folder, which contains a group of bridge data (characteristics, inspections results, etc… ), several queries, processing and views can be displayed. In addition, data can be imported or exported in different file formats (xlsx, json). a) b)

Fig. 3. Web platform screenshot: a) map-view and b) form-group for Level 0