budmin/finanzplaner
Watch
1
0
Fork
You've already forked finanzplaner
 0
Code Issues 6 Pull requests Projects Releases Packages Wiki Activity Actions

Initialer Plan: Finanzplaner (CSV-Import, Kategorisierung, Dashboard) #1

New issue
Open
opened 2026-07-06 21:38:14 +00:00 by glow · 3 comments
glow commented 2026-07-06 21:38:14 +00:00 (Migrated from gitlab.fluffyplace.de)
Copy link

Ziel

Kleine lokale Web-App zum Importieren von Bank-CSVs (comdirect Girokonto), Kategorisieren/Taggen von Buchungen und Visualisieren der Finanzen. Deployment als einzelner Docker-Container, kein Auth (nur intern).

Tech-Stack

  • Backend: Node.js + Express + TypeScript
  • Datenbank: SQLite (Datei auf gemountetem Volume, kein separater DB-Container)
  • Frontend: React (Vite), TypeScript
  • Deployment: ein Docker-Container (Express liefert API + gebautes Frontend aus)

CSV-Import (comdirect Girokonto)

  • Format ist fest auf comdirect zugeschnitten (kein generisches Spalten-Mapping vorerst)
  • Encoding robust erkennen (ISO-8859-1/Windows-1252 und UTF-8), da reale Exporte i.d.R. nicht UTF-8 sind
  • Kopf-/Fußzeilen überspringen (Neuer/Alter Kontostand, Leerzeilen), Header-Zeile erkennen
  • Deutsches Zahlenformat (-31,99) und Datumsformat (06.07.2026) parsen
  • Buchungen mit Status "offen" (vorgemerkte Kartenverfügungen, noch nicht gebucht) werden erkannt, aber nicht importiert/gespeichert — sie erscheinen bei einem späteren Import automatisch als gebuchte Zeile
  • Duplikaterkennung: Hash aus Konto + Buchungsdatum + Buchungstext + Betrag, damit sich überlappende Export-Zeiträume beim wiederholten Import nicht doppeln
  • Konto wird beim Import benannt/ausgewählt (z.B. "Girokonto — Alexander"), damit später weitere Konten ergänzt werden können

Datenmodell (SQLite)

  • accounts (id, name, created_at)
  • transactions (id, account_id, booking_date, valuta_date, vorgang, buchungstext, amount_cents, currency, category_id, notes, import_hash unique, created_at)
  • categories (id, name, color)
  • tags (id, name, color)
  • transaction_tags (transaction_id, tag_id)
  • rules (id, priority, field, match_type, pattern, category_id, tag_ids)

Kategorisierung

  • Manuell zuweisbar (Kategorie + mehrere Tags pro Buchung)
  • Regel-Engine: z.B. "WENN Buchungstext enthält 'SHELL' DANN Kategorie = Tanken"
  • Regeln laufen automatisch bei neuen Importen; auf Wunsch auch rückwirkend auf bestehende Buchungen anwendbar

Screens (siehe Mockup)

  1. Import: Konto wählen/anlegen, CSV hochladen, Vorschau (Neu/Duplikat/Ignoriert), Bestätigung
  2. Transaktionen: Filterbar (Zeitraum, Konto, Kategorie, Tag, Suche), Tabelle mit editierbarer Kategorie/Tags
  3. Dashboard: Zeitraum-Auswahl, KPI-Kacheln (Einnahmen/Ausgaben/Saldo), Ausgaben nach Kategorie (Donut), Einnahmen/Ausgaben pro Monat (Balken), Kontostand-Verlauf (Linie), Top-Empfänger
  4. Kategorien & Regeln: CRUD für Kategorien, CRUD für Regeln mit Live-Vorschau der Treffer

UI

  • Sprache: Deutsch
  • Dark Mode: umschaltbar (Toggle in der Sidebar), Standard folgt Systemeinstellung
  • Farbpalette: fixe Kategorie-Farben (nie neu gemischt), System-Sans-Typografie, tabular-nums für Beträge
  • Mobile/responsive (offen, siehe Hinweis unten)

Docker

  • Multi-Stage Dockerfile: Frontend bauen, Backend nach JS kompilieren, schlankes Node-Image liefert API + statisches Frontend aus
  • docker-compose.yml mit Volume für die SQLite-Datei
  • Kein Auth, da nur intern erreichbar

Offene Punkte / Later

  • Mobile-responsive Layout ist im Mockup noch nicht ausgearbeitet (Sidebar → Bottom-Nav/Hamburger, Tabellen → gestapelte Karten, Grids → einspaltig). Muss beim Frontend-Bau mitgedacht, aber nicht separat gemockt werden.
  • Weitere Bank-/Kontoformate (Tagesgeld, Kreditkarte) später ggf. per flexiblem Spalten-Mapping ergänzen

Umsetzungsreihenfolge

  1. Projekt-Setup (Backend + Frontend + Docker-Skeleton)
  2. Datenmodell/Migrationen
  3. CSV-Parser + Import-Endpoint (getestet gegen reale comdirect-Datei)
  4. Kategorien/Tags/Regeln CRUD
  5. Transaktionsliste + Filter-API
  6. Stats-Endpoints für Dashboard-Charts
  7. Frontend: Import-Seite
  8. Frontend: Transaktionsliste
  9. Frontend: Dashboard mit Charts
  10. Frontend: Kategorien/Regeln-Verwaltung
  11. Dockerfile + docker-compose, End-to-End-Test
  12. Manueller Test mit echter CSV im Browser
## Ziel Kleine lokale Web-App zum Importieren von Bank-CSVs (comdirect Girokonto), Kategorisieren/Taggen von Buchungen und Visualisieren der Finanzen. Deployment als einzelner Docker-Container, kein Auth (nur intern). ## Tech-Stack - Backend: Node.js + Express + TypeScript - Datenbank: SQLite (Datei auf gemountetem Volume, kein separater DB-Container) - Frontend: React (Vite), TypeScript - Deployment: ein Docker-Container (Express liefert API + gebautes Frontend aus) ## CSV-Import (comdirect Girokonto) - Format ist fest auf comdirect zugeschnitten (kein generisches Spalten-Mapping vorerst) - Encoding robust erkennen (ISO-8859-1/Windows-1252 und UTF-8), da reale Exporte i.d.R. nicht UTF-8 sind - Kopf-/Fußzeilen überspringen (`Neuer/Alter Kontostand`, Leerzeilen), Header-Zeile erkennen - Deutsches Zahlenformat (`-31,99`) und Datumsformat (`06.07.2026`) parsen - Buchungen mit Status **"offen"** (vorgemerkte Kartenverfügungen, noch nicht gebucht) werden erkannt, aber **nicht importiert/gespeichert** — sie erscheinen bei einem späteren Import automatisch als gebuchte Zeile - **Duplikaterkennung**: Hash aus Konto + Buchungsdatum + Buchungstext + Betrag, damit sich überlappende Export-Zeiträume beim wiederholten Import nicht doppeln - Konto wird beim Import benannt/ausgewählt (z.B. "Girokonto — Alexander"), damit später weitere Konten ergänzt werden können ## Datenmodell (SQLite) - `accounts` (id, name, created_at) - `transactions` (id, account_id, booking_date, valuta_date, vorgang, buchungstext, amount_cents, currency, category_id, notes, import_hash unique, created_at) - `categories` (id, name, color) - `tags` (id, name, color) - `transaction_tags` (transaction_id, tag_id) - `rules` (id, priority, field, match_type, pattern, category_id, tag_ids) ## Kategorisierung - Manuell zuweisbar (Kategorie + mehrere Tags pro Buchung) - Regel-Engine: z.B. "WENN Buchungstext enthält 'SHELL' DANN Kategorie = Tanken" - Regeln laufen automatisch bei neuen Importen; auf Wunsch auch rückwirkend auf bestehende Buchungen anwendbar ## Screens (siehe Mockup) 1. **Import**: Konto wählen/anlegen, CSV hochladen, Vorschau (Neu/Duplikat/Ignoriert), Bestätigung 2. **Transaktionen**: Filterbar (Zeitraum, Konto, Kategorie, Tag, Suche), Tabelle mit editierbarer Kategorie/Tags 3. **Dashboard**: Zeitraum-Auswahl, KPI-Kacheln (Einnahmen/Ausgaben/Saldo), Ausgaben nach Kategorie (Donut), Einnahmen/Ausgaben pro Monat (Balken), Kontostand-Verlauf (Linie), Top-Empfänger 4. **Kategorien & Regeln**: CRUD für Kategorien, CRUD für Regeln mit Live-Vorschau der Treffer ## UI - Sprache: Deutsch - Dark Mode: umschaltbar (Toggle in der Sidebar), Standard folgt Systemeinstellung - Farbpalette: fixe Kategorie-Farben (nie neu gemischt), System-Sans-Typografie, `tabular-nums` für Beträge - **Mobile/responsive** (offen, siehe Hinweis unten) ## Docker - Multi-Stage Dockerfile: Frontend bauen, Backend nach JS kompilieren, schlankes Node-Image liefert API + statisches Frontend aus - `docker-compose.yml` mit Volume für die SQLite-Datei - Kein Auth, da nur intern erreichbar ## Offene Punkte / Later - [ ] Mobile-responsive Layout ist im Mockup noch nicht ausgearbeitet (Sidebar → Bottom-Nav/Hamburger, Tabellen → gestapelte Karten, Grids → einspaltig). Muss beim Frontend-Bau mitgedacht, aber nicht separat gemockt werden. - [ ] Weitere Bank-/Kontoformate (Tagesgeld, Kreditkarte) später ggf. per flexiblem Spalten-Mapping ergänzen ## Umsetzungsreihenfolge 1. Projekt-Setup (Backend + Frontend + Docker-Skeleton) 2. Datenmodell/Migrationen 3. CSV-Parser + Import-Endpoint (getestet gegen reale comdirect-Datei) 4. Kategorien/Tags/Regeln CRUD 5. Transaktionsliste + Filter-API 6. Stats-Endpoints für Dashboard-Charts 7. Frontend: Import-Seite 8. Frontend: Transaktionsliste 9. Frontend: Dashboard mit Charts 10. Frontend: Kategorien/Regeln-Verwaltung 11. Dockerfile + docker-compose, End-to-End-Test 12. Manueller Test mit echter CSV im Browser
glow commented 2026-07-06 21:38:43 +00:00 (Migrated from gitlab.fluffyplace.de)
Copy link

changed title from Test Issue to Initialer Plan: Finanzplaner (CSV-Import, Kategorisierung, Dashboard)

<p>changed title from <code class="idiff"><span class="idiff left right deletion">Test Issue</span></code> to <code class="idiff"><span class="idiff left right addition">Initialer Plan: Finanzplaner (CSV-Import, Kategorisierung, Dashboard)</span></code></p>
glow commented 2026-07-06 21:38:43 +00:00 (Migrated from gitlab.fluffyplace.de)
Copy link

changed the description

changed the description
glow commented 2026-07-06 21:54:46 +00:00 (Migrated from gitlab.fluffyplace.de)
Copy link

mentioned in commit 459edeacac

mentioned in commit 459edeacacbadc5d640538a4214e6eaa32e76b8d
Sign in to join this conversation.
No Branch/Tag specified
Branches Tags
main
No results found.
Labels
Clear labels   
diskussion

   
feature-idee
No labels
diskussion
feature-idee
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
budmin/finanzplaner#1
No description provided.