- Einführung: Erläutere das Ziel des Videos und was du lernen wirst.
- Ideenfindung: Frage ChatGPT nach einfachen Chrome-Extension-Ideen, z.B. ein Link-Highlighter.
- Projekt-Setup:
- Erstelle einen Projekt-Ordner.
- Definiere die
manifest.json
Datei mit Name, Version, Beschreibung und Berechtigungen.
- HTML und JavaScript:
- Erstelle eine
popup.html
Datei für die Benutzerschnittstelle zur Farbauswahl. - Erstelle eine
popup.js
Datei für die JavaScript-Funktionalität.
- Erstelle eine
- Content- und Background-Scripts:
- Erstelle ein Content-Script, um die Links auf der Webseite zu markieren.
- Erstelle ein Background-Script für die Hintergrundüberwachung.
- Zipping und Laden:
- Verwende ChatGPT, um alle Dateien zu zippen und herunterzuladen.
- Lade die entpackte Erweiterung im Chrome-Browser im Entwicklermodus.
- Testen der Extension:
- Teste die Extension auf einer Webseite und passe die Farben an.
- Feature-Erweiterung:
- Füge neue Features hinzu, wie einen Aktivieren/Deaktivieren-Button und ein Rechtsklick-Menü.
- Lade die aktualisierte Version erneut in den Chrome-Browser.
- Veröffentlichung:
- Erstelle ein Entwicklerkonto im Chrome Web Store.
- Lade deine Extension hoch und veröffentliche sie.
- Verstehen der Grundstruktur einer Chrome-Extension.
- Erstellen einer funktionalen Chrome-Extension mit ChatGPT.
- Hinzufügen und Testen neuer Features in einer bestehenden Extension.
- Veröffentlichung einer Chrome-Extension im Chrome Web Store.
- ChatGPT
- Google Chrome Browser
- Texteditor (z.B. VS Code)
- Chrome Web Store Developer Dashboard