1
Installation und Einrichtung
hans edited this page 2026-06-26 09:45:23 +02:00

Installation & Einrichtung

Voraussetzungen

  • Ubuntu Server 22.04 / 24.04
  • Docker + Docker Compose auf dem Zielhost (Synology NAS)
  • Zugriff auf den Nginx Proxy Manager

Node.js via nvm installieren

nvm erlaubt mehrere Node-Versionen parallel — empfohlen gegenüber apt install nodejs (liefert veraltete Versionen).

# nvm installieren
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
source ~/.bashrc

# Node 20 LTS installieren und als Default setzen
nvm install 20
nvm alias default 20

# Versionen prüfen
node --version   # v20.x.x
npm --version    # 10.x.x

Debian-ng-Konflikt beheben

Auf Ubuntu/Debian ist /usr/bin/ng belegt durch den Texteditor ng (Paket ng-common).
Vor der Angular CLI Installation bereinigen:

# Prüfen ob Konflikt besteht
cat /usr/bin/ng | head -3
# Wenn "Yasuhiro Take" erscheint → Debian-ng, muss weg

sudo mv /usr/bin/ng /usr/bin/ng-editor

Angular CLI installieren

npm install -g @angular/cli

# Prüfen
ng version
# Angular CLI: 21.x.x
# Node.js:     20.x.x  ← keine Warning

Repository klonen

git clone http://code.neugasse.lan/hans/new-landing-page-homenas.git
cd new-landing-page-homenas

Dependencies installieren

npm install

Dev-Proxy einrichten

proxy.conf.json ist in .gitignore und wird nicht committed.
Vorlage kopieren und Token eintragen:

cp proxy.conf.example.json proxy.conf.json
nano proxy.conf.json
# DEIN_TOKEN_HIER durch den Directus-Token ersetzen

Inhalt von proxy.conf.json:

{
  "/tasmota1": {
    "target": "http://10.0.0.31",
    "secure": false,
    "changeOrigin": true,
    "pathRewrite": { "^/tasmota1": "" }
  },
  "/tasmota2": {
    "target": "http://10.0.0.32",
    "secure": false,
    "changeOrigin": true,
    "pathRewrite": { "^/tasmota2": "" }
  },
  "/api": {
    "target": "http://directus.neugasse.lan",
    "secure": false,
    "changeOrigin": true,
    "pathRewrite": { "^/api": "" },
    "headers": {
      "Authorization": "Bearer DEIN_TOKEN_HIER"
    },
    "logLevel": "debug"
  }
}

Fertig

Nach diesen Schritten ist die Umgebung einsatzbereit.
Weiter mit Lokale Entwicklung oder direkt zum Deployment.