VibeFinance/README.md

<div align="center">

# 💜 VibeFinance

**Persoonlijk vermogensdashboard**

Eigen vermogen · Schulden · Voortgang · Gebruikersbeheer

![React](https://img.shields.io/badge/React_18-20232A?style=flat&logo=react&logoColor=61DAFB)
![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.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>

---

## 🤖 Gebouwd met Claude.ai

Deze applicatie is volledig ontworpen en ontwikkeld met behulp van [Claude.ai](https://claude.ai) — de AI-assistent van Anthropic. Van architectuur tot gebruikersinterface: alles is stap voor stap tot stand gekomen in samenwerking met Claude.

---

## ⚡ Quick Start

> Vereisten: Docker Engine 24+ en Docker Compose v2+

**`.env`** — kopieer `.env.example` en vul in:

```env
POSTGRES_USER=vibefinance
POSTGRES_PASSWORD=kies_een_sterk_wachtwoord
JWT_SECRET=minimaal_64_willekeurige_tekens
FRONTEND_PORT=3300
```

```bash
# Genereer een veilige JWT_SECRET
openssl rand -hex 64
```

```bash
docker compose pull && docker compose up -d
```

Navigeer naar `http://<server-ip>:3300` en registreer je account. De **eerste** geregistreerde gebruiker krijgt automatisch de Admin-rol.

### Development (hot reload)

```powershell
.\dev.ps1
```

Frontend bereikbaar op **http://localhost** (poort 80 → Vite dev server op 5173).

> **Let op:** `.\dev.ps1 up` en `.\dev.ps1 down` wissen de development-database (volumes). Gebruik voor een gewone herstart `docker compose -f docker-compose.dev.yml down` gevolgd door `docker compose -f docker-compose.dev.yml up -d --build`.

---

## 🗂️ Functionaliteit

| Scherm | Wat het doet |
|---|---|
| 📊 **Dashboard** | Overzicht van totaal eigen vermogen, schulden en netto vermogen |
| 💰 **Eigen vermogen** | Vermogensposten per categorie beheren + geïnvesteerde fiat historiek |
| 📉 **Schulden** | Schulden bijhouden per blok met afbetalingsoverzicht |
| 📈 **Voortgang** | Grafieken en trends van EV en schuld over tijd (apart bij te houden) |
| 👥 **Gebruikers** | Accounts aanmaken, bewerken en beheren (Admin-rol vereist) |

---

## 🏗️ Architectuur

```
vibefinance/
├── docker-compose.yml          # Productie orchestratie (pre-built images)
├── docker-compose.dev.yml      # Standalone dev stack (hot reload)
├── .env.example                # Kopieer naar .env en vul in
├── package.json                # Versienummer — single source of truth
├── dev.ps1                     # Dev script (bouwen, starten, pushen)
│
├── frontend/                   # React / Vite SPA
│   ├── Dockerfile              # Multi-stage: dev → build → nginx
│   ├── nginx-spa.conf          # SPA fallback binnen de container
│   ├── vite.config.js
│   └── src/
│       ├── App.jsx             # Root – wiring + idle-logout
│       ├── main.jsx
│       ├── constants/          # Kleuren, tabs, begindata
│       ├── utils/              # Formatters, helpers
│       ├── hooks/              # useTheme
│       ├── context/            # AppContext (global state + API sync)
│       ├── components/
│       │   ├── ui/             # Primitieve UI (VCard, DonutChart…)
│       │   ├── LoginPage.jsx
│       │   ├── NavBar.jsx
│       │   ├── ProfielPopup.jsx
│       │   └── GebruikersBeheer.jsx
│       └── pages/
│           ├── DashboardTab.jsx
│           ├── EigenVermogenTab.jsx
│           ├── SchuldTab.jsx
│           └── VoortgangTab.jsx
│
└── backend/                    # Express REST API
    ├── Dockerfile              # Multi-stage: dev → production (non-root)
    └── src/
        ├── server.js           # Entry point
        ├── db.js               # PostgreSQL connectie + schema migraties
        ├── config/             # Omgevingsvariabelen
        ├── constants/          # Begindata (initialData.js)
        ├── middleware/         # auth.js, errorHandler.js
        ├── routes/             # auth, data, users, health
        └── stores/             # userStore, dataStore
```

**Stack:** React 18 · Vite · Node.js 22 · Express 4 · PostgreSQL 18 · JWT · bcrypt · Docker Compose v2

---

## 🔌 API

Beveiligde endpoints vereisen `Authorization: Bearer <token>`. Rate limiting: 20 req/15 min op auth-routes, 200 req/15 min globaal.

| Route | Methoden | Omschrijving |
|---|---|---|
| `/api/auth/register` | POST | Account aanmaken (eerste user = Admin) |
| `/api/auth/login` | POST | Inloggen, JWT token terug |
| `/api/auth/me` | GET, PATCH | Profiel ophalen en bijwerken |
| `/api/auth/me/password` | POST | Wachtwoord wijzigen |
| `/api/data` | GET, PUT, DELETE | Financiële data per gebruiker |
| `/api/users` | GET, POST, PATCH, DELETE | Gebruikersbeheer (Admin only) |
| `/api/health` | GET | Status + uptime |

---

## 🗄️ Database

| Tabel | Omschrijving |
|---|---|
| `users` | Accounts met bcrypt hash, rol, actief-vlag en aanmaakdatum |
| `user_data` | Financiële data per gebruiker (JSON) |

| Omgeving | Volume | Mount pad |
|---|---|---|
| Productie | `vibefinance_pgdata` | `/var/lib/postgresql` |
| Development | `postgres_dev_data` | `/var/lib/postgresql` |

> PostgreSQL 18 gebruikt `PGDATA=/var/lib/postgresql/18/docker` — het volume is daarom gemount op `/var/lib/postgresql` (niet `/data`).

---

## ⚙️ Omgevingsvariabelen

| Variabele | Standaard | Omschrijving |
|---|---|---|
| `POSTGRES_PASSWORD` | — | **Verplicht** |
| `JWT_SECRET` | — | **Verplicht** — minimaal 64 tekens |
| `POSTGRES_USER` | `vibefinance` | Database gebruikersnaam |
| `POSTGRES_DB` | `vibefinance` | Database naam |
| `JWT_EXPIRES` | `7d` | Geldigheidsduur token |
| `CORS_ORIGIN` | — | Externe domeinnaam |
| `FRONTEND_PORT` | `3300` | Externe poort frontend |

---

## 🔐 Beveiliging

- Wachtwoorden gehasht met bcrypt (cost factor 12)
- JWT authenticatie met instelbare vervaltijd
- Backend uitsluitend bereikbaar via nginx proxy
- Database bereikbaar alleen binnen het interne Docker netwerk
- Containers draaien als non-root
- Helmet security headers
- Rate limiting op alle endpoints

---

## 🛠️ Beheer

Zie `BEHEER.md` voor commando's voor lokale ontwikkeling, releases, logs en database-toegang.

---

<div align="center">

Privé gebruik · gebouwd met [Claude.ai](https://claude.ai)

</div>