YouTube Assistant

YouTube Summaries im Browser: Extension mit n8n & Gemini

Warum gibt es diese Woche ein Projekt, das ich schon vor Wochen gebaut habe? Na weil ich diese Woche eine Thunderbird-Extension gebaut habe, die einfach nicht bis zum Wochenende laufen wollte! Ich hatte diese Woche eine Menge um die Ohren, deshalb muss das so genannte Voice Reply Projekt bis nächste Woche warten.

Diese Woche geht es also stattdessen um meinen YouTube Assistant, der Fragen zu YouTube Videos beantwortet.

Meine Anforderungen

• Eine YouTube-URL direkt aus dem aktiven Tab an meine Extension schicken
• Im Popup eine Frage oder Anweisung eingeben („Welche Schauspieler kommen in diesem Video vor?“)
• n8n soll im Hintergrund die Anfrage speichern und regelmäßig abarbeiten
• Gemini soll mit der YouTube-URL gefüttert werden und mir eine Antwort zurückliefern
• Im Popup soll der Verlauf aller bisherigen Fragen/Antworten zu einem Video sichtbar sein
• Robust: auch wenn die AI blockt oder eine Anfrage fehlschlägt

Kurz gesagt: ein persönlicher „YouTube-Assistent“, der mir Zeit spart, wenn ich keine Lust habe, 30 Minuten Video zu schauen.

Mein AI-Workflow

Dieses Projekt habe ich fast komplett mit Claude gebaut.
Ich bin so vorgegangen, dass ich Frontend und Backend getrennt voneinander entwickelt habe.

• Frontend: relativ unkompliziert. Claude konnte mir hier schnell helfen, und die UI war ohne große Hürden fertig.
• Backend: deutlich zäher. Vor allem, weil Gemini ständig mit blockReason=OTHER blockierte, ohne eine Erklärung, warum. Claude und ich haben eine Weile gebraucht, um das weiter aufzudröseln und die richtige Lösung zu finden.
• Bei der Liste der vorherigen Anfragen hat Claude es unnötig kompliziert gemacht. Er wollte eine große Lösung bauen, aber ich musste gegensteuern, damit es am Ende simpel und pragmatisch bleibt (Akkordeons zum Aufklappen der Antworten).
• Ein weiteres Problem: Claude gab mir teilweise Konfigurationsanweisungen für n8n-Nodes, die es so gar nicht gibt. Da musste ich sehr genau hinschauen, um nicht auf Optionen hereinzufallen, die schlicht nicht existieren.
• Das Icon habe ich mir am Ende von ChatGPT designen lassen.

Fazit: Claude war ein guter Coding-Partner, aber man darf sich nicht blind auf seine Vorschläge verlassen. Besonders bei Low-Code-Tools wie n8n braucht es viel Gegencheck und manchmal auch eigenes Bauchgefühl.

Was die Extension kann

👉 Schickt eine YouTube-URL + Frage vom Browser direkt an mein Backend
👉 Holt regelmäßig den Status ab (Processing → Done oder Error)
👉 Zeigt Antworten direkt im Popup an
👉 Speichert alles in der Datenbank, inkl. Fehlern und blockierten Anfragen
👉 Zeigt eine kleine History im Popup, alte Antworten lassen sich per Klick aufklappen

Stack & Tools

• Browser-Extension (Manifest V2, Popup-UI mit HTML/JS)
• n8n (Webhooks, Schedule Trigger, MySQL, HTTP Request)
• Google Gemini 2.5 Flash (Antworten mit Video-URL)
• MariaDB (Datenbank für Status, Fehler, Antworten)

Herausforderungen & Learnings

• Gemini Debugging
  Das blockReason-Problem war mein größter Zeitfresser. Ohne klare Fehlermeldungen musste ich eine Weile debuggen.
• Claude & n8n
  Gute Unterstützung beim Coden, aber bei Node-Konfigurationen oft unbrauchbare Vorschläge.
• Verlauf im Popup
  Technisch simpel, aber vom Design her knifflig. Ich habe mich für Akkordeons entschieden. So sieht man alle Anfragen, aber die Antworten klappen erst auf Klick aus.
• UI
  Diesmal weniger „pretty“ als bei meinen letzten Projekten, dafür funktional.
• Security
  In Dev waren die Webhooks offen für alle Origins, aber produktiv müsste ich das natürlich einschränken.

Keine Live-Demo

Wie schon bei früheren Projekten gibt es diesmal keine öffentliche Demo.
Die Extension hängt an einer Datenbank, und um sie zu testen, müsste man sie manuell als temporäre Extension in Firefox laden. Ich glaube die Mühe will sich keiner machen, und Screenshots zeigen die Idee genauso gut.

Fazit

Woche 5: ✅

Ich habe gelernt, wie man eine Browser-Extension mit einem asynchronen n8n-Workflow verbindet.
Ich habe Debugging-Erfahrung mit blockierten LLM-Requests gesammelt.
Und ich habe ein History-Feature gebaut, das mir auch in künftigen Projekten helfen wird.

Nächste Woche zeige ich euch die Thunderbird-Extension. Wie der Name schon verrät geht es bei Voice Reply dann um sprachgesteuerte eMail-Antworten.