NewTube/README.md

NewTube — Agrégateur multi‑plateformes (Angular) 🌐

NewTube est un agrégateur de vidéos multi-plateformes, conçu pour une expérience unifiée et personnalisable. 🚀

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. 🎨

Providers Supportés 📹

• YouTube 🔴
• Dailymotion 🔵
• Twitch 🟣
• PeerTube (instances configurables) 🟢
• Odysee 🟡
• Rumble 🟠

Nouveautés Récentes ✨

• 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. 🏷

Stack Technique et Patterns 🛠

Technologies Utilisées 💻

• 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. 🌐

Patterns de Développement ⚙️

• 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:

Configuration avec Docker (Recommandé) 🐳

1. Copiez le fichier docker-compose/.env.example vers docker-compose/.env :

   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 :

   docker-compose -f docker-compose/docker-compose.yml up -d
   

4. L'application sera disponible sur http://localhost:8080

Configuration manuelle (Développement) 🔧

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:

Variables d'environnement 🌐

Les variables d'environnement suivantes peuvent être configurées :

• 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)

Lancement en Développement 💻

• npm run dev pour démarrer le serveur Angular. :play_button:

Build de Production 📦

• npm run build pour compiler l'app. 🔨

Déploiement avec Docker 🐳

• Construire l'image: docker build -t newtube:latest ..
• Lancer: docker compose up -d.

Variables d'Environnement ⚙️

• PORT, NODE_ENV, TWITCH_CLIENT_ID, etc. 🔒

Proxies pour le Développement 🌐

• Configurés dans proxy.conf.json pour contourner le CORS. 🛡

Utilisation Rapide 🚀

• Sélectionnez un provider et recherchez. 🔍
• Explorez les tendances ou vos vidéos aimées. ❤️

État des Fonctionnalités :checklist:

• Readiness des providers. :check_mark_button:
• Barre de recherche sur 'Liked videos'. :search:
• Tests unitaires. 🧪

Roadmap et TODO 🎯

Prochaines Étapes ▶️

• Ajouter un bandeau pour les providers non configurés. ⚠️
• Implémenter des tests unitaires. 🧪

Priorités 🔥

• Améliorer les intégrations provider. 🌐
• Ajouter des fonctionnalités avancées. 🚀

Scripts NPM 📦

Notes de Sécurité et Bonnes Pratiques 🔒

• Ne pas versionner les clés API. ⛔️
• Restreindre les clés par referer. 🛡
• Gérer les erreurs avec des messages clairs. ℹ️