site-agencja-ai-com/docker-compose-example/README.md

Agencja AI - Frontend (Dokploy Deployment)

Statyczna strona z intro YouTube (short FHD 16:9 lub vertical 9:16 — wybór po formacie viewportu). Tło przed filmem to miniaturka z YouTube. Konfiguracja w .env, HTML generowany przy starcie kontenera.

Struktura projektu

site-agencja-ai-com/
├── docker-compose.yml              # Lokalny dev (build z Dockerfile)
├── Dockerfile
├── default.conf
├── nginx.conf
├── index.html.template             # Szablon strony
├── generate-from-env.sh            # Generator HTML z .env
├── assets/imgs/favico/             # Favicony
├── site.webmanifest.template
└── docker-compose-example/         # Pliki deploymentowe Dokploy
    ├── docker-compose.yml
    ├── .env.example
    └── README.md

Dokploy deployment

Dokploy kopiuje na serwer tylko docker-compose.yml + .env — nie ma tam Dockerfile ani pełnego repo. Kontener przy starcie robi git clone publicznego repo, generuje HTML z .env i uruchamia nginx.

Kroki w Dokploy UI:

1. Nowa aplikacja (Compose) → wklej docker-compose-example/docker-compose.yml
2. Wklej .env (na podstawie .env.example) — ustaw FRONTEND_PORT, VIDEO_ID_*, opisy SEO
3. Domains → dodaj oba hosty (Container Port = 80, HTTPS = Let's Encrypt):
   • agencja-ai.com
   • www.agencja-ai.com ← wymagane — bez tego www dostaje domyślny cert Traefika (CN=*, self-signed) i telefony pokazują „serwer nie potrafi udowodnić tożsamości”
4. (Opcjonalnie) Advanced → Redirects → preset www → non-www
5. Deploy

Porty: compose mapuje ${FRONTEND_PORT}:80. Traefik/Dokploy dodatkowo routuje po FQDN do wewnętrznego portu 80 kontenera.

Repo musi być publiczne w Gitea — clone bez tokenu. Po git push zrób redeploy, żeby kontener pobrał nowy kod.

Jak to działa

1. Start kontenera — git clone publicznego repo do /app
2. generate-from-env.sh — buduje index.html i site.webmanifest ze zmiennych .env
3. Kopiowanie — assets/, default.conf, nginx.conf → nginx
4. Cleanup — rm -rf /app (brak pełnego repo na dysku kontenera)
5. Intro wideo — YouTube IFrame API, autoplay; po filmie redirect lub tło

Konfiguracja (.env)

Zmienna	Opis
FRONTEND_PORT	Port na hoście (np. 8081)
SITE_TITLE, SITE_BASE_URL, SITE_DESCRIPTION	Meta i SEO
FACEBOOK_DESCRIPTION, TWITTER_DESCRIPTION	Opisy social media
VIDEO_ID_FHD / VIDEO_ID_VERTICAL	ID shortów YouTube
POST_VIDEO_REDIRECT_URL_*	URL po zakończeniu filmu
POST_VIDEO_REDIRECT_ENABLED	true = redirect, false = zostaje tło

Lokalny development

cp .env.example .env
./dev.sh up
# Strona na http://localhost:${FRONTEND_PORT}  (domyślnie 8081)
# Edytuj .env → ./dev.sh config → F5 w przeglądarce

Produkcyjny build lokalnie:

docker compose up -d --build

Hardening bezpieczeństwa (wbudowany)

• Repo publiczne — brak tokena GITEA w kontenerze
• Po starcie /app usuwane — brak compose/README/szablonów na dysku
• nginx: whitelist ścieżek, blokada .env/.sh/.template, nagłówki CSP/Referrer-Policy
• CSP z 'unsafe-inline' dla skryptu YouTube (inline JS w index.html)
• server_tokens off — ukryta wersja nginx

Weryfikacja po deployu

# Strona działa
curl -sI https://agencja-ai.com/ | head -5

# Wrażliwe pliki niedostępne (404)
curl -sI https://agencja-ai.com/.env | grep HTTP
curl -sI https://agencja-ai.com/generate-from-env.sh | grep HTTP
curl -sI https://agencja-ai.com/random-path | grep HTTP

# Nagłówki bezpieczeństwa
curl -sI https://agencja-ai.com/ | grep -iE 'content-security-policy|referrer-policy|permissions-policy'

# W kontenerze (na serwerze)
docker logs agencja-ai-com-frontend --tail 30
docker exec agencja-ai-com-frontend ls /app 2>&1          # powinno: No such file
docker exec agencja-ai-com-frontend head -3 /usr/share/nginx/html/index.html

Rozwiązywanie problemów

Kontener Restarting / unhealthy

docker logs agencja-ai-com-frontend --tail 50

Typowe przyczyny:

• Repo prywatne → ustaw jako Public w Gitea
• Brak lub błędny .env w Dokploy
• Błąd w generate-from-env.sh (sprawdź logi)

Strona czarna / loader bez końca

• Sprawdź konsolę przeglądarki (CSP / YouTube)
• Upewnij się, że VIDEO_ID_* są poprawne w .env
• Po zmianie default.conf lub szablonu: git push + redeploy

Zmiana konfiguracji po deployu

1. Edytuj .env w Dokploy
2. Redeploy / restart kontenera (przy starcie ponownie klonuje repo i generuje HTML)

Błąd certyfikatu SSL na telefonie („serwer nie potrafi udowodnić…”)

Diagnoza (stan typowy):

• https://agencja-ai.com — certyfikat Let's Encrypt OK
• https://www.agencja-ai.com — self-signed (Traefik default, CN=*) → błąd na Androidzie / iPhone / WebView Facebooka

Naprawa w Dokploy (zalecane):

1. Domains → Add Domain
2. Host: www.agencja-ai.com, Port: 80, HTTPS: włączone, Certificate: letsencrypt
3. Deploy / poczekaj ~30 s na wystawienie certyfikatu
4. Sprawdź: curl -I https://www.agencja-ai.com (powinno być HTTP 200 lub 301, bez błędu SSL)
5. (Opcjonalnie) Advanced → Redirects → www to non-www

Facebook / in-app browser: linki w postach powinny wskazywać https://agencja-ai.com (bez www).