feat: enhance README with updates on Node.js version, responsive timer layout, and new features including live timer metrics and intelligent PDF export activation
Build and Push Docker Image / build (push) Successful in 26s

This commit is contained in:
Felix Schlusche
2025-10-31 18:55:46 +01:00
parent 0045a8f8d0
commit 0b408c93ee
+28 -10
View File
@@ -126,6 +126,8 @@ Eine Full-Stack-Zeiterfassungsanwendung, entwickelt mit Node.js, Express, SQLite
### 🎨 Modernes UI/UX ### 🎨 Modernes UI/UX
- **Premium Design**: Glass-Morphism, Gradients, Schatten, Animationen - **Premium Design**: Glass-Morphism, Gradients, Schatten, Animationen
- **Responsive**: Desktop, Tablet, Mobile - **Responsive**: Desktop, Tablet, Mobile
- Timer-Metriken: Rechts neben Timer auf großen Displays, darunter auf mobil
- Adaptive Layouts für alle Bildschirmgrößen
- **Dark Mode**: Augenschonendes dunkles Design - **Dark Mode**: Augenschonendes dunkles Design
- **Toast-Benachrichtigungen**: Visuelles Feedback - **Toast-Benachrichtigungen**: Visuelles Feedback
- **Icons**: Lucide Icons für klare Symbolik - **Icons**: Lucide Icons für klare Symbolik
@@ -134,7 +136,7 @@ Eine Full-Stack-Zeiterfassungsanwendung, entwickelt mit Node.js, Express, SQLite
## 🏗️ Technologie-Stack ## 🏗️ Technologie-Stack
**Backend:** **Backend:**
- Node.js 18+ mit Express.js - Node.js 20+ mit Express.js
- SQLite (better-sqlite3) für dateibasierte Persistenz - SQLite (better-sqlite3) für dateibasierte Persistenz
- Modulare Architektur (config, utils, routes) - Modulare Architektur (config, utils, routes)
@@ -148,6 +150,8 @@ Eine Full-Stack-Zeiterfassungsanwendung, entwickelt mit Node.js, Express, SQLite
**Infrastructure:** **Infrastructure:**
- Docker & Docker Compose - Docker & Docker Compose
- Multi-Stage Build für optimierte Images - Multi-Stage Build für optimierte Images
- Node.js 20 Alpine Linux base image
- Python build dependencies für native Module
- Gitea Actions CI/CD für automatische Builds - Gitea Actions CI/CD für automatische Builds
- Gitea Container Registry für Image-Hosting - Gitea Container Registry für Image-Hosting
@@ -163,15 +167,16 @@ timetracker/
│ ├── index.html # Single-Page Application │ ├── index.html # Single-Page Application
│ ├── favicon.svg # App Icon │ ├── favicon.svg # App Icon
│ └── js/ │ └── js/
│ ├── state.js # Globaler State │ ├── state.js # Globaler State (companyHolidayPreference, targetHours)
│ ├── utils.js # Hilfsfunktionen │ ├── utils.js # Hilfsfunktionen
│ ├── holidays.js # Feiertagsberechnung │ ├── holidays.js # Feiertagsberechnung (16 Bundesländer)
│ ├── bridge-days.js # Brückentag-Optimierung
│ ├── api.js # Backend-Kommunikation │ ├── api.js # Backend-Kommunikation
│ └── main.js # Hauptlogik (~3700 Zeilen) │ └── main.js # Hauptlogik (~4000 Zeilen)
├── .gitea/workflows/ # CI/CD Workflows ├── .gitea/workflows/ # CI/CD Workflows
│ └── docker-build.yml # Docker Build & Push │ └── docker-build.yml # Docker Build & Push
├── media/screenshots/ # App-Screenshots ├── media/screenshots/ # App-Screenshots
├── Dockerfile # Container-Image ├── Dockerfile # Container-Image (Node 20 + Python)
├── docker-compose.yml # Orchestrierung ├── docker-compose.yml # Orchestrierung
└── package.json └── package.json
``` ```
@@ -248,7 +253,7 @@ docker run -p 3000:3000 -v $(pwd)/db:/app/db zeiterfassung
### 💻 Option 3: Lokal (ohne Docker) ### 💻 Option 3: Lokal (ohne Docker)
**Voraussetzungen:** Node.js 18+ **Voraussetzungen:** Node.js 20+
```bash ```bash
# Repository klonen # Repository klonen
@@ -268,6 +273,9 @@ Die App bietet mehrere Export-Modi für verschiedene Anwendungsfälle:
### PDF-Export 📄 ### PDF-Export 📄
**Monats-Export:** **Monats-Export:**
- Button erscheint nur wenn letzter Tag des Monats vollständig erfasst ist
- Startzeit und Endzeit müssen vorhanden sein
- Verhindert versehentliche Exports unvollständiger Monate
- Klicke auf "PDF Export" in der Monatsansicht - Klicke auf "PDF Export" in der Monatsansicht
- Exportiert alle Einträge des aktuellen Monats - Exportiert alle Einträge des aktuellen Monats
- Professionelles Layout mit: - Professionelles Layout mit:
@@ -383,13 +391,14 @@ Die App verwendet Gitea Actions für automatische Builds und Deployments:
**Architektur:** Single-Page Application (SPA) mit REST-API Backend **Architektur:** Single-Page Application (SPA) mit REST-API Backend
**Tech-Details:** **Tech-Details:**
- Modulare Frontend-Architektur (5 separate JS-Dateien) - Modulare Frontend-Architektur (6 separate JS-Dateien)
- Flatpickr für Touch-optimierte Picker (auch in Tabellen-Inline-Edit) - Flatpickr für Touch-optimierte Picker (auch in Tabellen-Inline-Edit)
- Lucide Icons für Symbolik - Lucide Icons für Symbolik
- jsPDF + autoTable für PDF-Generierung - jsPDF + autoTable für PDF-Generierung
- SQLite für dateibasierte Persistenz - SQLite für dateibasierte Persistenz
- Server-seitige Berechnungen für Datenintegrität - Server-seitige Berechnungen für Datenintegrität
- Responsive Design (Tailwind CSS via CDN) - Responsive Design (Tailwind CSS via CDN)
- Live-Updates während Timer läuft (Saldo, Nettostunden)
**Datenpersistenz:** **Datenpersistenz:**
- SQLite-Datenbank: `db/timetracker.db` - SQLite-Datenbank: `db/timetracker.db`
@@ -398,11 +407,20 @@ Die App verwendet Gitea Actions für automatische Builds und Deployments:
- JSON-basierte Backups für Migration - JSON-basierte Backups für Migration
**Code-Organisation:** **Code-Organisation:**
- `state.js`: Globaler Application State - `state.js`: Globaler Application State (companyHolidayPreference, targetHours)
- `utils.js`: Hilfsfunktionen (Datum, Zeit, Format) - `utils.js`: Hilfsfunktionen (Datum, Zeit, Format)
- `holidays.js`: Feiertagsberechnung (16 Bundesländer) - `holidays.js`: Feiertagsberechnung (16 Bundesländer + Betriebsfrei)
- `bridge-days.js`: Brückentag-Optimierung
- `api.js`: Backend-Kommunikation - `api.js`: Backend-Kommunikation
- `main.js`: Hauptlogik, UI, Event-Handler - `main.js`: Hauptlogik, UI, Event-Handler (~4000 Zeilen)
**Neue Features:**
- Timer-Metriken mit Live-Berechnung
- Anpassbare tägliche Arbeitszeit (4h-10h)
- Laufendes Saldo in Tabelle
- Intelligente PDF-Export-Aktivierung
- Betriebsfreier Tag (Weihnachten/Silvester)
- Responsive Timer-Layout
## 📄 Lizenz ## 📄 Lizenz