baseui/README.md

basispanel UI

Entwicklungsprozess

Allgemeines

• auf Branch master dürfen nur Anton und Sebastian pushen
• Branch matdev ist für Mathias
• Anton und Sebastian mergen regelmäßig zu matdev, damit Mathias möglichst neue Komponenten auf dem aktuellen Stand einbaut
• nachdem in matdev neue vue-Komponenten angelegt wurden, welche bis dahin nur HTML und CSS enthalten, mergen Anton oder Sebastian matdev auf master um Logik einzubauen

Linux

# falls nicht bereits vorhanden
git clone ssh://git@git.basehosts.de:22234/panel/basispanel-ui.git
cd basispanel-ui

# die Branch auschecken, für die man verantwortlich ist
git checkout matdev # z.B. für Mathias

# Änderungen vom Server holen, fall nicht gerade geklont wurde
git pull

# fehlende Module installieren
npm install

# entwickeln und gleichzeitig webpack laufen lassen
npm run dev
# oder für eingebauten Server mit Hot-Reload
npm run serve

Windows

• z.B. SourceTree für GIT
• Repository ssh://git@git.basehosts.de:22234/panel/basispanel-ui.git clonen
• Branch wechseln (matdev für Mathias)
• Konsole (cmd oder PowerShell) aufrufen
• ins Verzeichnis ..../basispanel-ui wechseln

# fehlende Module installieren (falls im Windows Probleme auftauchen [z.B. Permission denied], node_modules/ Verzeichnis löschen und nochmal probieren)
npm install

# entwickeln und gleichzeitig webpack laufen lassen
npm run win-dev
# oder für eingebauten Server mit Hot-Reload
npm run win-serve

Änderungen hochladen

Linux

# eigene Änderungen commiten
git commit -m "Commit Nachricht"

# Commits zum Server pushen
git push

Windows

• Commiten und Pushen wie gewohnt

Aufbau des Repos

• assets = für Bilder und sonstige "statische" Dateien
• conf = Konfiguration der UI für jeweiligen Einsatz
• src = sämtlicher Quellcode zur UI
• src/components = Vue-Komponenten, die allgemein für die UI gültig sind
• src/fonts = Icon-Fonts
• src/views = Vue-Komponenten, die für den speziellen Einsatz entwickelt werden, z.B. spezielle Listen, Forms, ... (dieses Verzeichnis wird nach später aus dem Repo entfernt, um die UI allgeimengültig zu halten)

Build-Prozess

• wird auf Gitlab-Server/Runner durch .gitlab-ci.yml automatisch erledigt

# Module installieren (erzeugt node_modules/)
npm install

# bundle bauen
npm run build

• nach erfolgreichem Build sind folgende Verzeichnisse und Datein für das Produktiv-System bestimmt:
  • assets/
  • build/
  • conf/
  • index.html

Deployment

• in .gitlab.yml ist der Deploy für alle Branches auf "http://ui.basispanel.de/" eingerichtet
  • master: http://ui.basispanel.de/master/
  • matdev: http://ui.basispanel.de/matdev/
• die jeweiligen URL's sind auch unter Gitlab Environments im Projekt zu finden
• sollte mal ein automatische Deploy (fltp mirror) nicht alle geänderten Dateien kopieren, gibt es einen deploy_fullsync in Gitlab Pipelines, den man manuell anstoßen kann

bei Problemen

• wenn git pull oder git push mal nicht klappt wegen gleichzeitiger Änderungen auf dem Server und lokal --> Jemanden anrufen, der Ahnung hat oder GIT-Tutorials lesen ;)