TikTok Rezepte

Deine Rezepte, immer griffbereit. Speichere, organisiere und durchsuche Rezepte aus TikTok-Videos. Mit KI-gestützter Extraktion von Zutaten und Zubereitungsschritten.

Features

• TikTok-Extraktion — URL einfügen, Rezept wird automatisch erkannt
• KI-Unterstützung — Ollama extrahiert Zutaten und Schritte aus dem Video-Titel (optional)
• Suche & Filter — Rezepte nach Name, Zutaten oder Kategorie durchsuchen
• Einkaufsliste — Zutaten mit Haken abhaken beim Kochen
• Schritt für Schritt — Zubereitung mit Fortschrittsanzeige
• Invite-System — Geschlossene Registrierung, nur eingeladene Nutzer
• Admin-Dashboard — Einladungen verwalten, Nutzer einsehen und löschen
• Profil — Username und Passwort ändern
• Responsive — Funktioniert auf Desktop, Tablet und Handy

Screenshots

Startseite	Rezept hinzufügen	Admin Dashboard
Rezepte als Karten mit Suche und Kategorien	TikTok-URL + KI-Extraktion	Einladungen + Nutzerverwaltung

Tech Stack

Bereich	Technologie
Frontend	React 18, Vite, Tailwind CSS, React Router
Backend	Node.js, Express, bcryptjs, jsonwebtoken
Datenbank	JSON-Datei (keine Datenbank-Installation nötig)
KI	Ollama mit Mistral-Modell (optional)
Deployment	Docker Compose (Nginx + Node.js + Ollama)

Projektstruktur

tiktok-rezepte/
├── docker-compose.yml          # Docker Deployment
├── .env.example                # Umgebungsvariablen-Vorlage
│
├── backend/                    # Express API Server
│   ├── Dockerfile
│   ├── server.js               # Einstiegspunkt
│   ├── db.js                   # JSON-Datenbank
│   ├── routes/
│   │   ├── auth.js             # Authentifizierung & Benutzerverwaltung
│   │   └── recipes.js          # Rezepte CRUD + TikTok-Extraktion
│   ├── services/
│   │   ├── tiktok.js           # TikTok oEmbed API
│   │   └── ai.js               # Ollama KI-Integration
│   └── prompts/
│       └── extractRecipe.js    # System-Prompt für KI-Extraktion
│
└── frontend/                   # React SPA
    ├── Dockerfile
    ├── nginx.conf              # Nginx-Konfiguration
    ├── vite.config.js          # Vite + Dev-Server Proxy
    └── src/
        ├── App.jsx             # Routen & Navigation
        ├── context/
        │   └── AuthContext.jsx # Auth-Zustand (JWT)
        ├── pages/
        │   ├── Home.jsx        # Rezeptübersicht mit Suche
        │   ├── AddRecipe.jsx   # TikTok-URL + KI-Extraktion
        │   ├── RecipeDetail.jsx # Rezept ansehen/bearbeiten
        │   ├── Login.jsx       # Anmeldung
        │   ├── Register.jsx    # Registrierung (Invite)
        │   ├── Profile.jsx     # Profil bearbeiten
        │   └── Admin.jsx       # Admin Dashboard
        └── components/
            ├── RecipeCard.jsx   # Rezept-Karte
            ├── IngredientList.jsx # Zutaten (Lesen/Bearbeiten)
            ├── StepList.jsx     # Schritte (Lesen/Bearbeiten)
            └── CategoryBadge.jsx # Kategorie-Badge

Schnellstart (lokal)

Voraussetzungen

• Node.js 18+
• (Optional) Ollama für KI-Extraktion

Installation

# Repository klonen
git clone <deine-gitea-url>/dein-user/tiktok-rezepte.git
cd tiktok-rezepte

# Backend installieren
cd backend
npm install

# Frontend installieren
cd ../frontend
npm install

Starten

# Backend starten (Port 3001)
cd backend
npm run dev

# Frontend starten (Port 5173, in anderem Terminal)
cd frontend
npm run dev

Oder über das Root-Projekt:

npm run dev

Die App ist dann unter http://localhost:5173 erreichbar.

Standard-Login

Benutzername	Passwort
admin	admin123

Wichtig: Passwort nach dem ersten Login ändern!

Ollama (optional)

Für KI-gestützte Rezept-Extraktion:

# Ollama installieren (https://ollama.com)
ollama pull mistral

Ohne Ollama funktioniert die App vollständig — TikTok-Titel werden übernommen, Zutaten und Schritte werden manuell ausgefüllt.

Docker Deployment

Voraussetzungen

• Docker & Docker Compose
• (Optional) Synology NAS mit Container Manager

Schritte

# 1. .env-Datei anlegen
cp .env.example .env
# Werte in .env ändern (JWT_SECRET, ADMIN_PASS)!

# 2. Docker starten
docker compose up -d

# 3. Ollama Modell herunterladen
docker exec -it <ollama-container> ollama pull mistral

Umgebungsvariablen

Variable	Beschreibung	Standard
JWT_SECRET	Geheimnis für JWT-Tokens	tiktok-rezepte-secret-key-...
ADMIN_USER	Initialer Admin-Username	admin
ADMIN_PASS	Initial admin password	admin123
PORT	Backend-Port	3001
OLLAMA_URL	Ollama API-URL	http://localhost:11434
OLLAMA_MODEL	KI-Modell	mistral
DB_PATH	Pfad zur Datenbank-Datei	./data.json

Synology NAS mit Reverse Proxy

1. Code nach Gitea pushen
2. Container Manager → Projekt → "Aus Git-Repository"
3. Gitea-URL angeben, docker-compose.yml wählen
4. Environment-Variablen setzen
5. Deploy starten
6. Systemsteuerung → Login-Dienste → Reverse Proxy einrichten
7. SSL-Zertifikat über Let's Encrypt beantragen

API Endpoints

Authentifizierung (/api/auth)

Methode	Pfad	Beschreibung
POST	/register	Registrierung (Invite-Token erforderlich)
POST	/login	Anmeldung, gibt JWT zurück
GET	/me	Aktuellen Benutzer abrufen
POST	/invite	Einladung erstellen (Admin)
GET	/invites	Alle Einladungen anzeigen (Admin)
GET	/users	Alle Benutzer anzeigen (Admin)
DELETE	/users/:id	Benutzer löschen (Admin)
PUT	/credentials	Username/Passwort ändern

Rezepte (/api/recipes)

Methode	Pfad	Beschreibung
GET	/	Rezepte auflisten (optional: ?search=&category=)
GET	/categories	Kategorien mit Anzahl
GET	/ai-status	Ollama-Verfügbarkeit prüfen
GET	/:id	Einzelnes Rezept
POST	/	Rezept erstellen
PUT	/:id	Rezept aktualisieren
DELETE	/:id	Rezept löschen
POST	/from-tiktok	Rezept aus TikTok-URL extrahieren

Kategorien

Kategorie	Emoji
Frühstück	🍳
Hauptgericht	🍽️
Dessert	🍰
Snack	🍿
Getränk	☕
Sonstiges	📋

Wartung

Daten sichern

Die gesamte Datenbank liegt in einer einzigen Datei:

# Bei Docker:
cp data/data.json data/data.json.backup

# Bei lokaler Entwicklung:
cp backend/data.json backend/data.json.backup

Datenbank zurücksetzen

# Vorsicht: Alle Rezepte, User und Einladungen gehen verloren!
rm data/data.json
# Beim Neustart wird die Admin-Config neu erstellt

Logs anzeigen

docker compose logs -f backend
docker compose logs -f nginx

Lizenz

MIT