In diesem Beitrag möchten wir Ihnen einige wichtige Verbesserungen am Einstieg in Chrome-Erweiterungen vorstellen und Ihnen zeigen, wie Sie sich daran beteiligen können.
Die alte Anleitung
Bisher war das Beispiel für die ersten Schritte mit Chrome-Erweiterungen eine einfache Erweiterung, bei der die Hintergrundfarbe der aktuellen Seite geändert wurde, wenn der Nutzer auf eine Schaltfläche im Pop-up-Fenster der Erweiterung klickte. Außerdem gab es eine Optionsseite, auf der Sie eine von vier Farben auswählen konnten.
In diesem einfachen Beispiel wurde nicht gezeigt, wie Sie beliebte Funktionen hinzufügen, die in echten Erweiterungen enthalten sind. Es war an der Zeit für eine Überarbeitung.
Ein neuer Ansatz
Wir wissen, dass Entwickler unsere Dokumentation als Ausgangspunkt für ihr Lernen über Chrome-Erweiterungen nutzen. Unser Ziel ist es, einen zugänglichen, anfängerfreundlichen und relevanten Lernpfad zu bieten. Anstatt das vorhandene Beispiel zu verbessern, haben wir uns entschieden, von Grund auf neu anzufangen.
Die neue und verbesserte Sammlung „Einstieg“:
- Erweiterungen (einfach)
- Behandelt kurz einige grundlegende Konzepte der Chrome-Erweiterungsentwicklung, z. B. Webtechnologien und häufig verwendete Erweiterungskomponenten. Außerdem erfahren Sie, worauf Sie beim Entwerfen und Verteilen einer Erweiterung im Chrome Web Store achten müssen.
- Grundlagen der Entwicklung
- Der Workflow für die Erweiterungsentwicklung wird anhand eines Beispiels für Hallo, Erweiterungen vorgestellt. Es wird gezeigt, wie die Erweiterung während der Entwicklung geladen, Protokolle und Fehler gefunden, eine Projektstruktur ausgewählt und TypeScript verwendet wird.
- Anleitung für die Lesezeit
- Es ist schön zu wissen, wie viel Zeit wir für das Lesen eines Artikels benötigen. Unter „Lesezeit“ erfahren Sie, wie Sie auf jeder Seite der Erweiterungsdokumentation ein Element mit der geschätzten Lesezeit einfügen.
- Anleitung zum Konzentrationsmodus
- Wenn wir unnötige Elemente von einer Seite entfernen, können wir uns auf die relevantesten Informationen konzentrieren. Im Fokusmodus wird gezeigt, wie Sie den Stil der Seite ändern und einige ablenkende Elemente ausblenden.
- Anleitung für den Tabs Manager
- Bei der Recherche zur Erweiterungsentwicklung können Sie viele Dokumentationstabs in mehreren Fenstern haben. Mit dem Tab-Manager können Sie die Tabs für die Dokumentation Ihrer Chrome-Erweiterung und des Chrome Web Store organisieren.
In diesen Anleitungen erfahren Sie nicht nur, wie Sie praktische Erweiterungen erstellen, sondern auch, wie Sie die Entwicklung optimieren und Best Practices anwenden. Außerdem erleichtern diese Erweiterungen das Lesen der Erweiterungsdokumentation.
Ablauf
Jede Anleitung umfasst die folgenden Abschnitte:
- Die Aufgabe, die die Erweiterung ausführen soll.
- Die behandelten Lektionen.
- Wichtige Hinweise
- Eine detaillierte Anleitung zum Erstellen der Erweiterung.
- Erweiterung laden und testen
Wenn Sie sich der Herausforderung stellen möchten, haben wir einen Abschnitt mit einigen Ideen zusammengestellt, wie Sie Ihre Erweiterung anpassen oder weitere Funktionen hinzufügen können.
Wir brauchen deine Hilfe
Wir freuen uns auf Ihre Nachricht. Wenn Sie in diesen Anleitungen etwas Falsches oder Unklares finden, melden Sie bitte einen Fehler in unserem GitHub-Repository.
Wir sind der Meinung, dass dieser neue Leitfaden für den Einstieg eine deutliche Verbesserung gegenüber dem alten ist. Wir werden jedoch nicht stehenbleiben, sondern unsere Dokumentation weiter verbessern und erweitern, um allen Erweiterungs-Entwicklern besser zu helfen.
Foto von Vardan Papikyan auf Unsplash