Grundgerüst mit Server, PIN-Anmeldung und Docker-Deploy aufbauen

Die alte Clip-Auswahl-Oberfläche entfällt. Neu sind ein Express-Server,
der im Entwicklungsbetrieb Vite einbindet, eine PIN-Anmeldung mit
signiertem Sitzungs-Cookie und ein Docker-Image mit ffmpeg für VCH.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
ferdi2goandClaude Opus 5.5 committed 2026-09-29 09:15:01 +00:00
1 parent 8ed1396b1c
commit f7d249f28b
23 files changed
+4456 -1358

No files matched your search

+50 -23
View File
@@ -1,38 +1,65 @@
# Reelkit
# FuerDieCuts
Desktop UI for assembling weekly "Best-of" video reels from WhatsApp clips. Shows the Clip-Auswahl (clip selection) screen: browse transcribed clips, review AI recommendations, pick what goes into the reel, and reorder via drag-and-drop.
Schneidet aus einem WhatsApp-Chatexport automatisch ein YouTube-Video.
## Installation
Der Export (ZIP mit Medien) wird hochgeladen, die Videos werden anhand der
Zeitstempel im Chat chronologisch sortiert. Über eine Maske wählt man, was
automatisch passieren soll:
- Intro und Outro einfügen (eigene Dateien)
- Clips chronologisch aneinanderreihen
- Clips über 10 Sekunden auf genau 10 Sekunden beschleunigen
- Ton der Clips stummschalten (Intro und Outro ausgenommen)
- Backing Track unter den Clip-Teil legen (wird wiederholt und passend gekürzt)
- Voice-over pro Clip aufnehmen oder hochladen
- Lautstärke jeder Tonspur von 0 bis 100
Ausgabe ist ein MP4 in 1920×1080 mit 30 fps. Hochkant-Clips werden mittig mit
unscharfem Hintergrund eingesetzt. Zugang ist über eine PIN geschützt.
> Stand: Grundgerüst mit Anmeldung. Import, Schnitt und Oberfläche folgen.
## Voraussetzungen
- Node.js 20
- ffmpeg und ffprobe im `PATH` (`sudo apt install ffmpeg`)
## Installation und Start
```bash
npm install
cp .env.example .env # APP_PIN eintragen
APP_PIN=1234 npm run dev
```
## Development
```bash
npm run dev
```
## Build for production
`npm run dev` startet den Express-Server samt Vite im Entwicklungsmodus auf
einem Port (`PORT`, Vorgabe 3000). In Produktion:
```bash
npm run build
NODE_ENV=production APP_PIN=… npm start
```
## Tech Stack
## Umgebungsvariablen
- React 18
- Vite 6
- Plain CSS with CSS custom properties (oklch color space)
- Inter Tight + JetBrains Mono (Google Fonts)
| Name | Bedeutung |
|---|---|
| `APP_PIN` | PIN für die Anmeldung, Pflicht |
| `SESSION_SECRET` | optional; signiert die Sitzungs-Cookies, sonst wird eines erzeugt |
| `PORT` | Port des Servers, Vorgabe 3000 |
| `VCH_DATA_DIR` | Ablage für Projekte und Uploads, Vorgabe `./data` |
## Project Structure
## Befehle
```
src/
main.jsx — React entry point
App.jsx — Main app: clip list, sidebar, sticky footer
TweaksPanel.jsx — Floating tweaks panel (theme, density, export settings, …)
styles.css — All styles via CSS custom properties
```
- `npm test` – Tests (Node-Testrunner)
- `npm run lint` – ESLint
- `npm run build` – Frontend bauen
## Aufbau
- `server/` – Express-Server: Anmeldung, API, später Import und ffmpeg-Schnitt
- `src/` – React-Oberfläche (Vite)
- `test/` – Tests
- `Dockerfile` – Produktionsimage mit ffmpeg; Deploy über VCH (`.vch/deploy.yaml`)
Aufgebaut auf Node.js, Express, React, Vite und ffmpeg.