Front-End Development for EC2U Virtual Card Back-Office Application

This thesis describes the development of a back-office application that manages data and supports the ecosystem for Erasmus outgoing and incoming students within the EC2U alliance, which brings together seven universities across Europe. The EC2U Connect Center acts as a central hub that facilitates this collaboration to enable universities to share resources. The challenges related to EC2U will be discussed. To address the challenges of managing the data and ecosystem for the alliance, the EC2U alliance has developed an approach that includes the use of an application to assist with stakeholder analysis and the use of Unified Modelling Language (UML) use cases of the app. These will help clear and effective communication among the stakeholders and operators involved in the Erasmus program are addressed. Afterwards, The design of this application requires the use of various tools, including software development methodologies and the Javascript programming language and its library React.JS with TypeScript. Other tools that have been used are the Fetch API for server requests, vite for bundling the packages, and Lucid React for icons will be discussed. The implementation of the application includes a file structure, base layout, and login layout. Navigation is achieved through routing and Fetch API Hyper Text Transfer Protocol requests, such as Create, Read, Update, Delete operations code snippets will be presented. Finally, The results images of the application include virtual cards, users, and token pages, with features such as searching, sorting, creating new cards, updating cards, and deleting cards will be presented.