Vue.js UI for JS Backends

Go to file

Anton Schubert 07e2412c8e embed font inline, set correct main in package.json		2017-10-04 17:01:23 +02:00
assets/images	webpack fonts via file-loader	2017-08-31 22:55:24 +02:00
cms_template	add basic frame, basic login page	2017-08-29 20:58:39 +02:00
conf	allow use of custom form components, add textarea component, add checkbox input, use more absolute imports	2017-09-06 17:14:09 +02:00
src	embed font inline, set correct main in package.json	2017-10-04 17:01:23 +02:00
.eslintrc	fixed mix of tab and space in form-demo	2017-08-31 14:54:13 +02:00
.gitignore	Initial commit	2017-08-24 11:16:07 +02:00
.gitlab-ci.yml	review via docker app	2017-09-08 12:23:34 +02:00
docker-compose.yml	Update docker-compose.yml	2017-09-07 23:46:31 +02:00
Dockerfile	Update Dockerfile	2017-09-07 23:16:15 +02:00
index.html	minimal main.js	2017-09-25 12:31:39 +02:00
jsconfig.json	Initial commit	2017-08-24 11:16:07 +02:00
package-lock.json	embed font inline, set correct main in package.json	2017-10-04 17:01:23 +02:00
package.json	embed font inline, set correct main in package.json	2017-10-04 17:01:23 +02:00
README.md	test git push from windows	2017-09-20 13:00:27 +02:00
webpack.config.js	embed font inline, set correct main in package.json	2017-10-04 17:01:23 +02:00

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 ;)