Dans cet article, nous sommes ravis de vous présenter des améliorations importantes apportées à l'expérience de démarrage des extensions Chrome, ainsi que quelques façons de participer à ce rêve.
Ancien guide
Auparavant, le tutoriel de démarrage des extensions Chrome était un exemple d'extension de base qui modifiait la couleur d'arrière-plan de la page actuelle lorsque l'utilisateur cliquait sur un bouton dans la fenêtre pop-up de l'extension. Elle incluait également une page d'options sur laquelle vous pouviez choisir l'une des quatre couleurs.
Cet exemple de base n'a pas montré comment ajouter des fonctionnalités populaires présentes dans des extensions réelles. Il était temps de la retravailler.
Une nouvelle approche
Nous savons que les développeurs se tournent vers notre documentation pour commencer leur parcours d'apprentissage des extensions Chrome. Notre objectif est de leur fournir un parcours accessible, adapté aux débutants et pertinent. Plutôt que d'essayer d'améliorer l'exemple de tutoriel existant, nous avons décidé de repartir de zéro.
Présentation de la nouvelle collection "Premiers pas" améliorée:
- Présentation des extensions
- Présente brièvement certains concepts fondamentaux du développement d'extensions Chrome, tels que les technologies Web et les composants d'extension couramment utilisés. Il explique également les points à prendre en compte lors de la conception et de la distribution d'une extension sur le Chrome Web Store.
- Principes de base du développement
- Présentation du workflow de développement d'extensions en créant un exemple Hello, Extensions. Il explique comment charger l'extension pendant le développement, localiser les journaux et les erreurs, choisir une structure de projet et utiliser TypeScript.
- Tutoriel sur le temps de lecture
- Il est agréable de savoir combien de temps il nous faut pour lire un article. La section "Durée de lecture" vous explique comment insérer un élément contenant la durée de lecture estimée sur chaque page de documentation de l'extension.
- Tutoriel sur le mode Sans distractions
- En supprimant les éléments superflus d'une page, nous pouvons nous concentrer sur les informations les plus pertinentes. Le mode Concentration montre comment modifier le style de la page et masquer certains éléments gênants.
- Tutoriel sur le Gestionnaire d'onglets
- Lorsque vous effectuez des recherches sur le développement d'extensions, vous pouvez vous retrouver avec de nombreux onglets de documentation dans plusieurs fenêtres. Le Gestionnaire d'onglets organise les onglets de votre extension Chrome et de la documentation du Chrome Web Store.
Ces tutoriels vous expliquent comment créer des extensions concrètes, mais vous donnent également des conseils et des bonnes pratiques de développement. De plus, l'utilisation de ces extensions améliorera votre expérience lorsque vous lirez la documentation de l'extension.
Que se passe-t-il ensuite ?
Chaque tutoriel comprend les sections suivantes:
- Tâche que l'extension effectuera.
- Les leçons qui seront abordées
- Ce que vous devez savoir avant de commencer
- Instructions détaillées pour créer l'extension.
- Comment charger et tester l'extension
Si vous aimez les défis, nous avons inclus une section contenant quelques idées pour personnaliser votre extension ou ajouter d'autres fonctionnalités.
Nous avons besoin de votre aide
Nous avons hâte de vous lire. Si vous remarquez une erreur ou un point obscur dans ces guides, veuillez signaler un bug dans notre dépôt GitHub.
Nous pensons que ce nouveau guide de démarrage est une amélioration significative par rapport à l'ancien, mais nous ne nous arrêterons pas là. Nous allons continuer à améliorer et à développer notre documentation pour mieux servir tous les développeurs d'extensions.
Photo de Vardan Papikyan, publiée sur Unsplash