diff --git a/README.md b/README.md index f18916d..0c1c720 100644 --- a/README.md +++ b/README.md @@ -1,126 +1,240 @@ -# NewTube — Agrégateur multi‑plateformes (Angular) 🌐 +# NewTube — Votre hub vidéo multi-plateformes 🎬🌐 -NewTube est un agrégateur de vidéos multi-plateformes, conçu pour une expérience unifiée et personnalisable. 🚀 +Agrégez, explorez et regardez des vidéos depuis +- **YouTube** 🔴 +- **Dailymotion** 🔵 +- **Twitch** 🟣 +- **PeerTube** 🟢 (multi-instances) +- **Odysee** 🟡 +- **Rumble** 🟠 -### Objectifs Principaux 🎯 +--- -- Fournir une recherche et des tendances unifiées sans changer d'onglet. 🔍 -- Gérer les clés API et configurations pour éviter les erreurs. 🔒 -- Offrir une UX fluide avec thèmes, recherche avancée et gestion des préférences. 🎨 +## ✨ Pourquoi NewTube ? (Objectifs clés) -### Providers Supportés 📹 +* 🔎 **Recherche unifiée & tendances** : un seul champ de recherche, des sections par fournisseur, filtres cohérents. +* 🧭 **Navigation claire** : thèmes (Trending, Live, Gaming, News…), onglets Shorts, pages Playlists/History/Liked. +* 👥 **Multi-utilisateur** : playlists **publiques/privées**, préférences, région/qualité par défaut. +* ⚙️ **Prod-ready** : API Node/Express, SQLite intégré, rate-limit, logs, tests ciblés. +* 📦 **Ops friendly** : image Docker, script `maj.sh`, variables d’env, **astuces `daemon.json`** pour registres HTTP. -- YouTube 🔴 -- Dailymotion 🔵 -- Twitch 🟣 -- PeerTube (instances configurables) 🟢 -- Odysee 🟡 -- Rumble 🟠 +--- -### Nouveautés Récentes ✨ +## 🧩 Stack -- Barre de recherche sur la page 'Liked videos' avec filtrage côté serveur. :search: -- Améliorations de l'affichage des badges fournisseurs dans le header. 🏷 +* 🅰️ **Angular 20** (standalone), **RxJS**, **TailwindCSS** +* 🟩 **Node/Express** (sert `dist/` + API) +* 🐳 **Docker/Compose** (déploiement) +* 💾 **SQLite** (par défaut) – simple, portable -## Stack Technique et Patterns 🛠 +--- -### Technologies Utilisées 💻 +## 🎥 Fournisseurs supportés -- **Framework**: Angular 20 avec composants standalone et mode strict. :angular: -- **Réactivité**: Signals pour une gestion d’état réactive. 📶 -- **HTTP & Observables**: RxJS pour les appels asynchrones. 🚀 -- **Styling**: Tailwind CSS via CDN pour un design rapide et réactif. 🖌 -- **Proxy**: Configuration pour gérer le CORS en développement. 🌐 +| Plateforme | Recherche | Lecture | Shorts | Live | Playlists\* | +| ----------------------------- | :-------: | :-----: | :----: | :--: | :---------: | +| YouTube 🔴 | ✅ | ✅ | ✅ | ✅ | ✅ | +| Dailymotion 🔵 | ✅ | ✅ | ⏳ | ✅ | ⏳ | +| Twitch 🟣 | ✅ | ✅ | N/A | ✅ | ⏳ | +| PeerTube 🟢 (multi-instances) | ✅ | ✅ | ⏳ | ⏳ | ⏳ | +| Odysee 🟡 | ✅ | ✅ | ⏳ | ⏳ | ⏳ | +| Rumble 🟠 | ✅ | ✅ | ⏳ | ⏳ | ⏳ | -### Patterns de Développement ⚙️ +\* Playlists = intégration locale NewTube (création/gestion); la synchro native dépend de l’API publique de chaque fournisseur. -- Contrôle centralisé de la readiness des providers. -- Mappers pour normaliser les réponses des APIs. -- Effets Angular pour des mises à jour réactives. 🔁 -- Recherche côté serveur pour les pages comme 'Liked videos'. 🔍 +--- -## Prérequis :checklist: +## 🖥️ Fonctionnalités (vue d’ensemble) -### Configuration avec Docker (Recommandé) 🐳 +* 🧭 **Accueil “Tendances & Viral”** par fournisseurs +* 🧩 **Thèmes** : Trending, Live, Gaming, Sports, News, Finance, Tech, Science, Health, Music, Podcasts, Movies/TV, Education, Travel, Food, DIY, Auto… +* 🎯 **Shorts** : affichage dédié (séparé des vidéos longues) +* ❤️ **Liked videos** avec recherche serveur +* 🕘 **History** (recherches + visionnage) +* 📚 **Playlists** publiques/privées (CRUD, compteurs, dates MAJ) +* 🔐 **Auth légère** (JWT), **rate-limit** API +* ⚙️ **Préférences** : langue, thème (système / dark / light / blue / black), région, qualité par défaut +* 🧩 **PeerTube multi-instances** : activer/désactiver, choisir l’instance active -1. Copiez le fichier `docker-compose/.env.example` vers `docker-compose/.env` : - ```bash - cp docker-compose/.env.example docker-compose/.env - ``` -2. Modifiez le fichier `.env` pour y ajouter vos clés API -3. Lancez l'application avec Docker Compose : - ```bash - docker-compose -f docker-compose/docker-compose.yml up -d - ``` -4. L'application sera disponible sur http://localhost:8080 +--- -### Configuration manuelle (Développement) 🔧 +## 🗂️ Structure du repo -1. Installer Node.js (LTS). :node: -2. Exécuter `npm install` pour les dépendances. 📦 -3. Copier et configurer `assets/config.local.example.js` en `assets/config.local.js`. 🔑 -4. Lancer avec `npm run dev`. :play_button: +* `docker-compose/` -### Variables d'environnement 🌐 + * `docker-compose.yml` — service `newtube` (image, ports, env, volumes, restart) + * `.env.example` — modèle d’environnement + * `maj.sh` — **pull** image + **restart** stack + * `init.sh` — init des dossiers/volumes & `.env` +* `docker/` -Les variables d'environnement suivantes peuvent être configurées : + * `Dockerfile` — build Node/Express (sert `dist/` + API) + * `scripts/env-dump.sh` — génère `assets/config.js` depuis l’env (option NGINX) + * `config/nginx.conf` — exemple (si variante NGINX) +* `server/` -- `GEMINI_API_KEY` - Clé API pour Gemini (IA) -- `YOUTUBE_API_KEY` - Clé API YouTube -- `YOUTUBE_API_KEYS` - Liste de clés API YouTube (séparées par des virgules) -- `VIMEO_ACCESS_TOKEN` - Token d'accès Vimeo -- `TWITCH_CLIENT_ID` - ID client Twitch -- `TWITCH_CLIENT_SECRET` - Secret client Twitch -- `YT_CACHE_TTL_MS` - Durée de vie du cache en millisecondes (défaut: 3600000 - 1 heure) + * `index.mjs` — routes API, statiques `dist/`, downloads + * `db.mjs` — SQLite + migrations légères + * `tests/playlist_visibility.test.mjs` — tests playlists +* `db/` — `schema.sql` + `migrations/` +* `assets/` — `config.local.example.js` +* `src/`, `app/`, `public/` — front Angular +* `package.json` — scripts (`dev`, `build`, `api`, `api:watch`, `test:playlists`) -### Lancement en Développement 💻 +--- -- `npm run dev` pour démarrer le serveur Angular. :play_button: +## 🧱 Prérequis -### Build de Production 📦 +* 🐧 Linux (recommandé) / macOS / Windows (WSL2 ok) +* 🐳 Docker Engine ≥ 24, Compose v2 +* 🟩 Node.js ≥ 20 (dev local) +* 🔐 Accès au registre d’images (ex. `docker-registry.dev.home:5000`) -- `npm run build` pour compiler l'app. 🔨 +--- -## Déploiement avec Docker 🐳 +## 🚀 Installation -- Construire l'image: `docker build -t newtube:latest .`. -- Lancer: `docker compose up -d`. +### Option A — Docker (recommandé) -### Variables d'Environnement ⚙️ +```bash +cp docker-compose/.env.example docker-compose/.env +# Éditez docker-compose/.env (hostnames, clés API, secrets…) +cd docker-compose +docker compose up -d +``` -- `PORT`, `NODE_ENV`, `TWITCH_CLIENT_ID`, etc. 🔒 +Application : [http://localhost:8080](http://localhost:8080) (mappage `8080:4000`) -## Proxies pour le Développement 🌐 +### Option B — Dev local -- Configurés dans `proxy.conf.json` pour contourner le CORS. 🛡 +```bash +npm install +cp assets/config.local.example.js assets/config.local.js # (optionnel) +npm run dev # front + api dev proxy +# API seule : +npm run api +npm run api:watch +# Build prod : +npm run build +``` -## Utilisation Rapide 🚀 +--- -- Sélectionnez un provider et recherchez. 🔍 -- Explorez les tendances ou vos vidéos aimées. ❤️ +## 🔁 Déploiement & mises à jour (`maj.sh`) -## État des Fonctionnalités :checklist: +```bash +chmod +x docker-compose/maj.sh +./docker-compose/maj.sh +``` -- [X] Readiness des providers. :check_mark_button: -- [X] Barre de recherche sur 'Liked videos'. :search: -- [ ] Tests unitaires. :test_tube: +Ce script fait : -## Roadmap et TODO 🎯 +1. `docker image pull /newtube-angular:latest` +2. `docker compose down` +3. `docker compose up -d` -### Prochaines Étapes ▶️ +**Vérifications** : `docker compose ps`, `docker logs newtube --tail=200`, `curl -I http://localhost:8080` -- Ajouter un bandeau pour les providers non configurés. ⚠️ -- Implémenter des tests unitaires. :test_tube: +--- -### Priorités 🔥 +## 🧰 Astuce Ops — `Docker /etc/docker/daemon.json` (registres HTTP/insecure) -- Améliorer les intégrations provider. 🌐 -- Ajouter des fonctionnalités avancées. 🚀 +> À configurer **sur la machine qui exécute** `docker compose` / `maj.sh`. -## Scripts NPM 📦 +```bash +sudo mkdir -p /etc/docker +sudo tee /etc/docker/daemon.json >/dev/null <<'JSON' +{ + "insecure-registries": ["docker-registry.dev.home:5000"], + "registry-mirrors": [], + "debug": false +} +JSON +sudo systemctl daemon-reload +sudo systemctl restart docker +docker info | grep -i registry +``` -## Notes de Sécurité et Bonnes Pratiques 🔒 +Ajoutez au besoin `log-driver`, `log-opts`, `default-address-pools`, etc. -- Ne pas versionner les clés API. ⛔️ -- Restreindre les clés par referer. 🛡 -- Gérer les erreurs avec des messages clairs. ℹ️ +--- + +## 🔐 Variables d’environnement (exemples) + +**Service / compose** + +* `NGINX_HOSTNAME`, `DIR_NEWTUBE`, `TZ` + +**App / serveur** + +* `PORT` (4000), `NODE_ENV`, `JWT_SECRET` +* `ACCESS_TTL_MIN`, `REFRESH_TTL_DAYS`, `REMEMBER_TTL_DAYS` +* `YT_CACHE_TTL_MS` +* **Clés API** : `GEMINI_API_KEY`, `YOUTUBE_API_KEY` ou `YOUTUBE_API_KEYS` (CSV), `VIMEO_ACCESS_TOKEN`, `TWITCH_CLIENT_ID`, `TWITCH_CLIENT_SECRET` +* `NEWTUBE_DB_FILE` (chemin SQLite alternatif) + +> Voir `docker-compose/.env.example` pour un point de départ. + +--- + +## 🩺 Troubleshooting (rapide) + +* 🧾 **Certif/registre** : `x509… unknown authority` → configurez `daemon.json` (ci-dessus) puis `systemctl restart docker` +* 🔌 **Port 8080 occupé** : changez le mappage dans `docker-compose.yml` +* 🗄️ **Permissions volumes** : vérifiez que `DIR_NEWTUBE` existe et est accessible par Docker +* 🧩 **Variables manquantes** : complétez `.env` (clés API, `JWT_SECRET`, etc.) +* 🌐 **CORS en dev** : utilisez le `proxy.conf.json` et `npm run dev` + +--- + +## 🗺️ Roadmap + +* ✅ Dist statique + API Node/Express +* ✅ Playlists **publiques/privées** (tests de visibilité) +* ✅ Barre de recherche **Liked videos** (filtrage serveur) +* ✅ PeerTube **multi-instances** (activer/désactiver, set active) +* ✅ Thème (système / dark / light / blue / black) +* ✅ Préférences (langue, thème, région, qualité par défaut) +* ✅ Auth légère (JWT), rate-limit API +* ✅ Navigation par thèmes (Trending, Live, Gaming, News, Finance, Tech, Science, Health, Music, Podcasts, Movies/TV, Education, Travel, Food, DIY, Auto…) +* ⏳ **Abonnements** (routes + DB) +* ⏳ **Tags** & recherche par tags +* ⏳ **Page “Shorts”** unifiée (tous fournisseurs) + badges de durée +* ⏳ **Téléchargements** intégrés (file queue, répertoires, quotas, reprise) +* ⏳ **Import/Export** playlists (JSON / OPML-like) +* ⏳ **Sous-titres & transcripts** (si dispo API; fallback parsing) +* ⏳ **PWA** (installable, offline cache des métadonnées) +* ⏳ **Chromecast / AirPlay** +* ⏳ **Raccourcis clavier** & mode “TV” +* ⏳ **Observabilité** : healthcheck `/healthz`, métriques, page **Admin** (clés OK/KO, logs, versions) +* ⏳ **OAuth** (Google/Twitch) pour import favoris/abonnements +* ⏳ **Cache serveur** configurable (TTL par provider) +* ⏳ **Qualité vidéo** : sélecteur et “auto” intelligent +* ⏳ **Traduction UI** (i18n) élargie +* ⏳ **Theming avancé** (polices, densité, accents) + +--- + +## 🔒 Notes de sécurité + +* ❌ Ne **jamais** versionner de secrets réels +* 🔑 Utiliser `.env` hors VCS + restrictions par referer côté fournisseurs +* 🚧 Limiter l’exposition publique de l’API, activer **rate-limit** (déjà en place) +* 🧪 Ajouter des tests e2e/units pour les zones critiques (auth, playlists, downloads) + +--- + +## 🤝 Contribuer + +Issues & PR bienvenues ! Proposez des connecteurs, des règles de parsing plus robustes ou des idées d’UX. +Astuce : ouvrez une PR “Draft” tôt pour discussion/feedback. + +--- + +## 📜 Licence + +MIT (voir `LICENSE`) + +--- + +> 💡 **Tip produit** : gardez l’UX simple — **Thèmes fixes sous le header**, **Shorts séparés**, **CTA clairs** (“View All”, “Add to playlist”), et utilisez les **états vides** (empty states) sur History/Liked/Playlists pour guider l’utilisateur.