Koffan – mittels Traefik und Docker installieren

Koffan ist eine benutzerfreundliche Webanwendung zur Verwaltung von Einkaufslisten, speziell für Paare und Familien. Sie ermöglicht die Echtzeit-Synchronisierung zwischen mehreren Geräten, sodass jeder weiß, was noch gekauft werden muss und was sich bereits im Warenkorb befindet. Die App funktioniert in jedem Browser auf Mobilgeräten und Desktop-Computern. Zum Anmelden genügt ein einziges Passwort – eine komplizierte Registrierung ist nicht erforderlich. Ich habe es heute mal probiert. Meiner Frau gefällt die Webapp gut.

1. Grundvoraussetzungen

• Docker & Docker Compose v2 (Debian / Ubuntu)
• Traefik ab v3.6 mit CrowdSec installieren und konfigurieren
  

2. Ordner und Dateien anlegen

Zuerst legen wir einen Ordner an.

mkdir -p /opt/containers/koffan

3. Docker Compose erstellen

Nun erstellen wir uns eine Docker Compose Datei.

nano /opt/containers/koffan/docker-compose.yml

Inhalt

services:
  koffan:
    image: ghcr.io/pansalut/koffan:latest
    container_name: koffan
    restart: unless-stopped

    env_file:
      - .env

    labels:
      traefik.docker.network: proxy
      traefik.enable: "true"
      traefik.http.routers.koffan.entrypoints: websecure
      traefik.http.routers.koffan.middlewares: default@file
      traefik.http.routers.koffan.rule: Host(`koffan.euredomain.de`)
      traefik.http.routers.koffan.service: koffan
      traefik.http.routers.koffan.tls: "true"
      traefik.http.routers.koffan.tls.certresolver: tls_resolver
      traefik.http.services.koffan.loadbalancer.server.port: "80"
    networks:
      default: null
      proxy: null


    volumes:
      - koffan-data:/data  # speichert /data/shopping.db persistent

volumes:
  koffan-data:

networks:
  proxy:
    external: true


Code-Sprache: JavaScript (javascript)

Noch anzupassen:

• eure Domain bei Traefik (koffan.euredomain.de)

4. Datei .env anlegen

Nun legen wir uns noch die .env Datei an. Dazu gebt ihr folgendes ein:

nano /opt/containers/koffan/.env

Inhalt:

APP_ENV=production
APP_PASSWORD=    ### Kennwort setzen
DEFAULT_LANG=de


Code-Sprache: PHP (php)

Ich habe ein kurzes und einfaches Kennwort gewählt. Soll man sich ja gut merken können.

5. Koffan starten

Dazu gebt ihr einfach folgenden Befehl ein:

docker compose -f /opt/containers/koffan/docker-compose.yml up -d

Wartet nun einige Minuten und geht anschließend auf eure Homepage koffan.euredomain.de

Dort solltet ihr folgendes sehen:

Jetzt euer Kennwort aus der .env eingeben.

Ihr könnt nun die Einkaufslisten anlegen.

Hier noch eine Beispielkonfiguration der Basis-Kategorien.

Frische & Kühlung

• Obst & Gemüse
• Kühlregal
• Käse & Aufschnitt
• Fleisch & Fisch
• Backwaren

Tiefkühl

• Tiefkühl

Trocken & Vorrat

• Nudeln, Reis & Getreide
• Konserven & Gläser
• Backzutaten
• Gewürze & Saucen
• Frühstück (Müsli, Cornflakes, Brotaufstrich)

Getränke

• Getränke
• Kaffee & Tee

Haushalt & Drogerie

• Drogerie
• Haushalt
• Reinigung
• Papierwaren

Sonstiges

• Tierbedarf
• Apotheke
• Sonstiges

Ihr könnt zudem die Webseite als Icon auf dem Home-Bildschirm legen: So geht’s beim iPhone:

1. Safari öffnen: Safari-App (Browser) starten.

2. Website aufrufen: Zur gewünschten Website navigieren, beispielsweise auf koffan.euredomain.de, die zum Home-Bildschirm hinzugefügt werden soll.

3. Teilen-Symbol antippen: Am unteren Bildschirmrand befindet sich mittig ein Symbol, das wie ein Quadrat mit einem Pfeil aussieht, der nach oben zeigt. Tippen Sie es an.

4. “Zum Home-Bildschirm” antippen: In der Reihe der Symbole, die nun auftaucht, bis zur Option “Zum Home-Bildschirm” scrollen und diese auswählen.

5. Icon benennen: Geben Sie dem Schnellzugriff einen Namen Ihrer Wahl oder übernehmen Sie den vorgeschlagenen Namen. Dieser Name erscheint anschließend unter dem Icon auf dem Home-Bildschirm.

6. Bestätigen: Klicken Sie “Hinzufügen” , um den Vorgang abzuschließen. Das Icon der Website erscheint jetzt auf dem Home-Bildschirm und kann dort wie gewohnt verschoben bzw. eingeordnet werden.