Youtube Explorer
Année
2026
Type
Extension navigateur
Stack
Next.js, React, JavaScript, Node.js, Extension Navigateur, Native Messaging, CSS Modules, yt-dlp, FFmpeg
Contexte
Ce projet est né d’un besoin assez simple : avoir un outil personnel pour rechercher rapidement une vidéo, l’écouter dans une interface plus légère, et récupérer l’audio quand le contenu s’y prête. Je voulais aussi expérimenter un format un peu différent d’une application web classique, en reliant une interface Next.js à une extension navigateur et à un traitement local sur la machine. L’objectif était surtout de créer un outil pratique, utilisable au quotidien, tout en explorant des sujets techniques que je connaissais moins : extension Chrome/Brave, communication avec une application locale, traitement audio et interaction entre plusieurs briques JavaScript.
Réalisation
J’ai développé une application Next.js permettant de rechercher des vidéos, d’afficher les résultats dans une interface dédiée et de lancer certaines actions depuis l’app. Le projet intègre également une extension Chrome/Brave capable de détecter le contexte de navigation lorsqu’une vidéo est consultée. La partie intéressante du projet repose sur la communication entre l’extension, l’application et un host local Node.js via Native Messaging. Cela permet de déclencher des traitements côté machine, notamment autour de l’analyse vidéo et de la génération audio avec des outils comme yt-dlp et FFmpeg. L’interface conserve aussi un historique de recherche côté navigateur, affiche les étapes de traitement et garde une expérience simple : rechercher, vérifier, puis lancer l’action souhaitée.
Résultat
Le projet est devenu un vrai outil personnel que j’utilise régulièrement, et que quelques amis utilisent également. Ce n’est pas seulement un prototype visuel : l’application fonctionne réellement, avec une extension navigateur, une app locale et une logique de traitement complète. YouTube Explorer m’a permis de mieux comprendre la création d’extensions navigateur, le Native Messaging, les routes API Next.js, la communication avec un processus Node.js local et l’intégration d’outils externes dans une application web. C’est un projet personnel, mais concret, qui montre ma capacité à transformer un besoin simple en outil utilisable.