videodownloader/PROMPT.md

Master-prompt i plan wdrożenia

Dokument zawiera (1) gotowy prompt do wygenerowania aplikacji od zera oraz (2) plan realizacji i wdrożenia na infrastrukturze naurecki.pl.

---

1. Master-prompt (do odtworzenia aplikacji)

Zbuduj webową aplikację SPA „Video & Sound Downloader Pro” - webowy odpowiednik desktopowego narzędzia łączącego yt-dlp i FFmpeg. Stack: backend NestJS (TypeScript), frontend React + Vite (TypeScript). Monorepo apps/api, apps/web.

Backend (NestJS):

• POST /api/probe - przyjmuje { url }, uruchamia yt-dlp -J i zwraca tytuł, miniaturę, czas trwania, dostępne jakości oraz listę języków napisów.
• POST /api/jobs - { url, mode, format, subtitles }, gdzie mode ∈ {mp3, mp4, playlist, facebook}. Tworzy job w katalogu tymczasowym, uruchamia yt-dlp (+ ffmpeg) z argumentami zależnymi od trybu i zwraca jobId.
• GET /api/jobs/:id/events - strumień SSE z liniami logu i procentem postępu (parsowanie --newline --progress); zdarzenia log, progress, done, error.
• GET /api/jobs/:id/file - strumień gotowego pliku do przeglądarki, po wysłaniu sprzątnięcie katalogu joba (TTL-cleanup dla porzuconych).
• DELETE /api/jobs/:id - STOP: zabija proces yt-dlp/ffmpeg joba.
• Joby w pamięci (EventEmitter) - bez bazy, lekko i „portable”.
• Mapowanie trybów: mp3 → -x --audio-format mp3 --audio-quality <kbps>; mp4/facebook → -f "bv*[height<=H]+ba/b" --merge-output-format mp4; playlist → --yes-playlist, wynik pakowany do ZIP. Napisy: --write-subs --sub-langs all --embed-subs (bez auto-napisów: --no-write-auto-subs).

Frontend (React) - odwzoruj 1:1 zrzut ekranu desktopu: ciemny motyw, akcenty niebieskie. Nagłówek z ikoną i wersją; pole Link z przyciskiem wklejenia ze schowka; sekcja „Wybierz opcję” z 4 kafelkami (MP3 / MP4 / PLAYLISTA / FACEBOOK, ikony i kolory jak na zrzucie, aktywny kafel podświetlony); „Jakość / Format” jako dropdown zależny od trybu; w miejscu „Zapisz do” - informacja o pobraniu przez przeglądarkę; duży przycisk „POBIERZ …” + STOP; banner trybu testowego; panel Log na żywo (z SSE); stopka Wsparcie / O mnie.

Wymagania niefunkcjonalne: obsługa długich procesów (SSE bez buforowania), czytelne komunikaty końcowe i logi, scalanie audio+wideo, brak pozostałości po jobie. Konteneryzacja: obraz API zawiera python3 + yt-dlp + ffmpeg; web to nginx serwujący build React i proxujący /api (z wyłączonym buforowaniem dla SSE).

---

2. Plan realizacji i wdrożenia

#	Krok	Szczegóły
1	Repo	gitea.naurecki.pl/dariusz/videodownloader (push HTTPS-token).
2	Backend	NestJS: moduły jobs, ytdlp, health; SSE; STOP; ZIP playlist.
3	Frontend	React+Vite, UI ze zrzutu, klient SSE do panelu Log.
4	Docker	apps/api/Dockerfile (node+yt-dlp+ffmpeg), apps/web/Dockerfile (nginx).
5	Compose	docker-compose.prod.yml: web → 127.0.0.1:8086, api wewnętrznie.
6	CI/CD	.gitea/workflows/deploy.yml: push main → build + up -d (docker.sock).
7	Reverse proxy	vhost Apache videodownloader.naurecki.pl → 127.0.0.1:8086.
8	SSL	certbot --apache -d videodownloader.naurecki.pl.
9	DNS	Gotowe - *.naurecki.pl (wildcard) już wskazuje 212.109.167.206.
10	Weryfikacja	https://videodownloader.naurecki.pl + test pobrania.

Ustalenia infrastrukturalne (zweryfikowane na serwerze):

• Serwer naurecki.pl (= mail.naurecki.pl, 212.109.167.206): Apache + certbot, aktywny gitea-runner z zamontowanym docker.sock.
• Wolny port loopback: 8086.
• Wzorzec deployu zgodny z istniejącym projektem gdziebts.