Frontend

Vue 3 SPA für den App Store. Studierende und Dozierende verwalten hier Apps, deployen sie auf OpenStack und sehen ihre Deployments.

Setup

Dieses Repository wird nicht eigenständig gestartet. Der gesamte Stack — inklusive Frontend — wird über das deployment-Repository hochgefahren. Vollständige Anleitung: deployment/README.md.

Voraussetzung für alle folgenden Befehle: make dev-up aus dem deployment/-Verzeichnis wurde ausgeführt und der Stack läuft.

Entwicklung

Alle make-Befehle werden aus dem deployment/-Verzeichnis des deployment-Repos ausgeführt — dort liegt das Makefile.

# in app-store/deployment
make dev-restart-frontend   # Frontend-Container neu starten
make dev-logs-frontend      # Frontend-Logs verfolgen
make shell-frontend         # interaktive Shell im Container

Lint, Type-Check und Tests werden im Frontend-Container ausgeführt — make shell-frontend öffnet eine Shell, in der die üblichen npm run lint, npm run type-check, npm run test:unit und npm run build zur Verfügung stehen.

Technologie-Stack

• Vue 3 mit Composition API und TypeScript
• Pinia für globalen State
• Vue Router mit Auth-Guards
• Axios mit Keycloak-Bearer-Interceptor
• Tailwind CSS für Styling
• vue-i18n für Mehrsprachigkeit (DE/EN)
• oidc-client-ts für Keycloak-Login

Mehr

• Architektur und projektübergreifende Doku: .github-Repo
• API-Docs (Backend Swagger): http://localhost:8000/docs (nach make dev-up)