Zum Hauptinhalt springen

Frontend

Das Frontend der CoSy-Webanwendung ist eine Vue.js-Anwendung, die mit Node.js und npm gebaut wird.

Installation und Start (Node.js)​

Für die Weiterentwicklung des CoSy-Backends wird empfohlen, das Projekt von GitHub zu klonen und lokal zu starten.

Projekt von GitHub klonen​

Projekt von GitHub klonen:

git clone git@github.com:uzl-cosy/cosy-frontend.git
cd cosy-frontend

Abhängigkeiten installieren​

Im Projektverzeichnis müssen die Abhängigkeiten mit npm installiert werden:

npm install

Entwicklungsserver starten​

npm run dev

Der Entwicklungsserver ist unter http://localhost:3000 erreichbar.

Installation und Start (Docker)​

Für das Deployment der CoSy-Webanwendung wird empfohlen, die Docker-Images zu verwenden.

Projekt von GitHub klonen​

Projekt von GitHub klonen:

git clone git@github.com:uzl-cosy/cosy-frontend.git
cd cosy-frontend

Docker-Image bauen​

docker build -t cosy-frontend . --build-arg BACKEND_URL=http://localhost:8080 --build-arg COSY_DEVICE_LABEL_1=CoSy-Koffer-1 --build-arg COSY_DEVICE_URL_1=http://localhost:8000

Docker-Container starten​

docker run -p 80:80 cosy-frontend

Der Docker-Container ist unter http://localhost erreichbar.

Konfiguration​

Zu Build-Zeit können verschiedene Umgebungsvariablen gesetzt werden, um das Verhalten des Frontends zu beeinflussen.

Backend-URL​

Die URL des Backends kann über die Umgebungsvariable VUE_APP_BACKEND_URL gesetzt werden. Standardmäßig ist die URL auf http://localhost:8080 gesetzt.

Beispiel

VITE_APP_BACKEND_URL=http://localhost:8080

Koffer-Name und Koffer-URL​

Die Namen und URLs der Geräte/Koffer können über die Umgebungsvariablen VITE_COSY_DEVICE_LABEL_N und VITE_COSY_DEVICE_URL_N gesetzt werden.

Beispiel

VITE_COSY_DEVICE_LABEL_1=CoSy-Koffer-1
VITE_COSY_DEVICE_URL_1=http://cosy1.example.com
VITE_COSY_DEVICE_LABEL_2=CoSy-Koffer-2
VITE_COSY_DEVICE_URL_2=http://cosy2.example.com