Merge pull request 'upgrade prod to postgres 18 same as dev' (#3) from update-0.1.3 into main

Reviewed-on: #3

BEHEER.md

@@ -51,6 +51,24 @@ docker compose pull && docker compose up -d
 docker compose down -v && docker compose up -d
 ```
 
+### PostgreSQL versie-upgrade
+
+Bij een upgrade van PostgreSQL (bijv. 16 → 18) is de bestaande data niet compatibel. Stappen:
+
+```bash
+# 1. Backup maken
+docker exec vibefinance_postgres pg_dump -U vibefinance vibefinance > backup-$(date +%F).sql
+
+# 2. Oude containers en volumes verwijderen
+docker compose down -v
+
+# 3. Nieuwe versie starten
+docker compose up -d
+
+# 4. Backup terugzetten
+docker exec -i vibefinance_postgres psql -U vibefinance -d vibefinance < backup-YYYY-MM-DD.sql
+```
+
 ---
 
 ## Logs en diagnose
@@ -133,8 +151,8 @@ Rollen:
 ## Registry
 
 ```
-10.0.3.108:3000/vibe/vibefinance-backend
+vibehoogie.duckdns.org:3000/vibe/vibefinance-backend
-10.0.3.108:3000/vibe/vibefinance-frontend
+vibehoogie.duckdns.org:3000/vibe/vibefinance-frontend
 
 Tags:
   latest          productie — meest recente release
@@ -145,7 +163,7 @@ Tags:
 
 Inloggen op registry:
 ```bash
-docker login 10.0.3.108:3000
+docker login vibehoogie.duckdns.org:3000
 ```
 
 ---
@@ -155,8 +173,8 @@ docker login 10.0.3.108:3000
 De app vergelijkt de draaiende versie met de laatste release op Gitea. Configuratie staat in `package.json`:
 
 ```json
-"repository": "https://10.0.3.108:3000/vibe/VibeFinance",
+"repository": "https://vibehoogie.duckdns.org:3000/vibe/VibeFinance",
-"updateCheckUrl": "https://10.0.3.108:3000/api/v1/repos/vibe/VibeFinance/releases/latest"
+"updateCheckUrl": "https://vibehoogie.duckdns.org:3000/api/v1/repos/vibe/VibeFinance/releases/latest"
 ```
 
 Vite en de build-scripts lezen deze velden automatisch uit — geen handmatige build-args nodig.

Changelog.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## [0.1.3] - 2026-04-16
+
+### Toegevoegd
+- Versienummer met logo zichtbaar boven de logout-knop in de sidebar
+
+### Gewijzigd
+- Registry verplaatst van intern IP (`10.0.3.108:3000`) naar publieke DuckDNS-hostnaam (`vibehoogie.duckdns.org`) — toegankelijk via Nginx Proxy Manager
+- PostgreSQL productie geüpgraded van versie 16 naar 18 (volume mount aangepast naar `/var/lib/postgresql`)
+- Witte rand rondom de app verwijderd (globale CSS reset toegevoegd, `App.css` gekoppeld aan `App.jsx`)
+
+---
+
 ## [0.0.4] - 2026-04-08
 
 ### Toegevoegd

README.md

@@ -10,7 +10,7 @@ Eigen vermogen · Schulden · Voortgang · Gebruikersbeheer
 ![Node.js](https://img.shields.io/badge/Node.js_22-339933?style=flat&logo=node.js&logoColor=white)
 ![PostgreSQL](https://img.shields.io/badge/PostgreSQL_18-4169E1?style=flat&logo=postgresql&logoColor=white)
 ![Docker](https://img.shields.io/badge/Docker_Compose-2496ED?style=flat&logo=docker&logoColor=white)
-![Version](https://img.shields.io/badge/versie-0.0.3-8b5cf6?style=flat)
+![Version](https://img.shields.io/badge/versie-0.1.3-8b5cf6?style=flat)
 ![Built with Claude](https://img.shields.io/badge/Gebouwd_met-Claude.ai-8b5cf6?style=flat&logo=anthropic&logoColor=white)
 
 </div>

dev.ps1

@@ -35,7 +35,7 @@ $ErrorActionPreference = "Stop"
 # PROJECTCONFIGURATIE - pas alleen dit blok aan voor een nieuw project
 # =============================================================================
 $appName       = "VibeFinance"
-$registry      = "10.0.3.108:3000/vibe"
+$registry      = "vibehoogie.duckdns.org/vibe"
 $backendImage  = "vibefinance-backend"
 $frontendImage = "vibefinance-frontend"
 $apiUrl        = "/api"

docker-compose.yml

@@ -10,7 +10,7 @@
 services:
 
   postgres:
-    image: postgres:16-alpine
+    image: postgres:18-alpine
     container_name: vibefinance_postgres
     restart: unless-stopped
     environment:
@@ -18,7 +18,7 @@ services:
       POSTGRES_USER:     ${POSTGRES_USER:-vibefinance}
       POSTGRES_PASSWORD: ${POSTGRES_PASSWORD}
     volumes:
-      - vibefinance_pgdata:/var/lib/postgresql/data
+      - vibefinance_pgdata:/var/lib/postgresql
     healthcheck:
       test: ["CMD-SHELL", "pg_isready -U vibefinance"]
       interval: 10s
@@ -28,7 +28,7 @@ services:
       - vibefinance_net
 
   backend:
-    image: 10.0.3.108:3000/vibe/vibefinance-backend:latest
+    image: vibehoogie.duckdns.org/vibe/vibefinance-backend:latest
     container_name: vibefinance_backend
     restart: unless-stopped
     env_file: .env
@@ -47,11 +47,11 @@ services:
       - vibefinance_net
 
   frontend:
-    image: 10.0.3.108:3000/vibe/vibefinance-frontend:latest
+    image: vibehoogie.duckdns.org/vibe/vibefinance-frontend:latest
     container_name: vibefinance_frontend
     restart: unless-stopped
     ports:
-      - "${FRONTEND_PORT:-3300}:80"
+      - "${FRONTEND_PORT:-3400}:80"
     depends_on:
       backend:
         condition: service_healthy

frontend/package.json

@@ -1,7 +1,7 @@
 {
     "name":  "vibefinance-frontend",
-    "version":  "0.1.0",
+    "version":  "0.1.3-dev",
-    "updateCheckUrl":  "https://10.0.3.108:3000/api/v1/repos/vibe/VibeFinance/releases/latest",
+    "updateCheckUrl":  "https://vibehoogie.duckdns.org/api/v1/repos/vibe/VibeFinance/releases/latest",
     "private":  true,
     "type":  "module",
     "scripts":  {

frontend/src/App.css

@@ -1,5 +1,12 @@
-* {
+*, *::before, *::after {
   box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+html, body, #root {
+  height: 100%;
+  width: 100%;
 }
 
 input[type="number"]::-webkit-inner-spin-button {

frontend/src/App.jsx

@@ -1,3 +1,4 @@
+import "./App.css";
 import { AppProvider, useApp } from "./context/AppContext.jsx";
 import { useEffect, useRef, useState } from "react";
 import LoginPage from "./components/LoginPage.jsx";

frontend/src/components/NavBar.jsx

@@ -276,6 +276,27 @@ export default function NavBar() {
           </div>
         )}
 
+        {/* App naam + versienummer */}
+        {!collapsed && (
+          <div style={{ display: "flex", alignItems: "center", gap: 8, padding: "8px 12px", marginBottom: 4 }}>
+            <div style={{
+              width: 32, height: 32, flexShrink: 0,
+              background: `linear-gradient(135deg, ${PURPLE}, #a855f7)`,
+              borderRadius: 8, display: "flex", alignItems: "center", justifyContent: "center",
+              boxShadow: `0 0 8px ${PURPLE}44`,
+            }}>
+              <svg width="18" height="18" viewBox="0 0 20 20" fill="none">
+                <polyline points="2,15 6,9 10,12 14,5 18,8" stroke="#fff" strokeWidth="2" strokeLinejoin="round" strokeLinecap="round"/>
+                <line x1="2" y1="17" x2="18" y2="17" stroke="rgba(255,255,255,0.35)" strokeWidth="1.2"/>
+              </svg>
+            </div>
+            <div>
+              <div style={{ fontSize: 13, fontWeight: 700, color: T.text }}>VibeFinance</div>
+              <div style={{ fontSize: 11, color: T.muted }}>{version}</div>
+            </div>
+          </div>
+        )}
+
         {/* Uitloggen */}
         <SidebarItem
           onClick={logout}

package.json

@@ -1,8 +1,8 @@
 {
   "name": "vibefinance",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "VibeFinance — persoonlijk vermogensbeheer",
   "private": true,
-  "repository": "https://10.0.3.108:3000/vibe/VibeFinance",
+  "repository": "https://vibehoogie.duckdns.org/vibe/VibeFinance",
-  "updateCheckUrl": "https://10.0.3.108:3000/api/v1/repos/vibe/VibeFinance/releases/latest"
+  "updateCheckUrl": "https://vibehoogie.duckdns.org/api/v1/repos/vibe/VibeFinance/releases/latest"
 }

release.ps1

@@ -27,7 +27,7 @@ $ErrorActionPreference = "Stop"
 # ── PROJECTCONFIGURATIE — pas alleen dit blok aan voor een nieuw project ──
 # ════════════════════════════════════════════════════════════════════════════
 $appName       = "VibeFinance"
-$registry      = "10.0.3.108:3000/vibe"
+$registry      = "vibehoogie.duckdns.org/vibe"
 $backendImage  = "vibefinance-backend"
 $frontendImage = "vibefinance-frontend"
 $apiUrl        = "/api"