Mini-Applications in KI-Léierbud
Marco Barnig, 18.8.2025
Mini-applications are the core of the KI-Léierbud portal. They consist of the following elements:
1. A sequence of web pages with content downloaded via REST API from the KI-Léierbud WordPress server for the “knowledge,” “quiz,” and “polls” mini-applications, and individual interactive web pages for the “hands-on” applications.
2. A set of html, css, js, svg, and png files, structured as follows:
project-root/
├─ section/
│ └─ app-name/
│ ├─ index.html
│ └─ assets/ (css/js/svg…)
└─ operations/
├─ login/
│ └─ index.html
└─ search/
└─ index.html
These directories are preferably stored in the /httpdocs/ folder of the PLESK server. If necessary, they may be installed in specific subdomains of ki-leierbud.lu for technical reasons.
3. Graphic cards with an illustration and description of the mini-application (similar to the LetzAI prompt cards) that are displayed in the portal dashboard. Besides promoting the KI-Léierbud on social networks, they are also used as the first and last card in the web page sequences described in point 1.
Layout and Features of the Mini-Applications
The layout of the “knowledge,” “quiz,” and “polls” mini-applications is template-based.
- A single template is sufficient for the “knowledge” sequences (different background colors may optionally be chosen depending on the intended user level).
- Three templates are required for the “quiz” sequences, depending on the quiz type (yes/no, multiple choice, etc.). The same number of 3 also seems appropriate to standardize the “polls.”
- All templates are based on a common Master-Template with header and footer
Mini-Application “Knowledge/Visionaries”
The “Visionaries” mini-application serves as an example to present the typical layout and features of a “Knowledge” mini-application.
A functional prototype of this mini-application is available at:
https://ki-leierbud.lu/knowledge/visionaries
A detailed screenshot of one page from the related sequence is shown below:
Some other pages are assembled in the second figure below:
The following figure shows the sequence of web pages displayed on a mobile device in the “Visionaries” sequence:
You can directly access a specific page, for example the French page about Harold Cohen with ID=1501, by adding the suffix ?id=1501 to the URL:
https://ki-leierbud.lu/knowledge/visionaries/?id=1501
You can also retrieve a page in a specific language by adding the suffix ?lang=xx to the URL of an existing page in another language. If the page does not exist in the desired language xx, the following priority order will be applied: en, fr, de, pt, lb.
Development of the “Knowledge” Template
The template for the “Knowledge” mini-application was developed within two days using ChatGPT-5. The complete conversation from start to finish is available at the following shared link:
https://chatgpt.com/share/68a6f4e5-58ac-8005-9db8-74577cd58ba0
Reading this conversation should enable non-technical collaborators to quickly become familiar with development assisted by ChatGPT-5 and to develop templates for mini-applications themselves.
Remaining Errors in the “Knowledge” Template
The “Knowledge” mini-application template still contains a few residual errors, especially on mobile phones. One issue is that the width of the header and footer exceeds the screen width in portrait mode. Another issue is that the “swipe” function has not yet been implemented. However, by rotating the mobile device to landscape mode, one can still test all the features. The language handling for accessing a specific page also still requires some adjustment.
I plan to fix these issues once the layout and features have been definitively approved by the partners.