Une petite recette pour savoir comment créer la nôtre Google Chrome extensions.
Extensions ChromeJ’utilise de nombreuses extensions Google Chrome pour faciliter mon travail et m’amuser également. En fait, il est très intéressant de constater à quel point ils peuvent être efficaces. Je vérifie même s’il existe des extensions récentes dans le Boutique en ligne Chrome de temps en temps.
Mais vous êtes-vous déjà demandé ce que sont exactement les extensions Chrome et comment elles sont développées ? Moi aussi, je me suis posé la même question et j’ai cherché sur Google comme vous venez de le faire et j’ai découvert que c’est assez simple, c’est une combinaison de HTML, CSSet Javascript. Il s’agit donc simplement d’une application Web avec en plus manifeste.json fichier, qui convertit l’application Web en une extension Chrome.
Comme je l’ai mentionné ci-dessus, les extensions Chrome sont une combinaison de pages Web HTML et de fichier manifeste. Discutons-en pièce par pièce.
- HTML, CSS et JavaScript.
Pour développer notre première extension, nous avons besoin d’une connaissance de base en développement Web.
HTML: Commencez par créer la structure de la popup ou de la page d’options de votre extension en utilisant HTML. Il s’agit de l’interface utilisateur avec laquelle votre extension interagira.
CSS: Stylisez votre extension avec CSS pour la rendre visuellement attrayante et conviviale.
Javascript: Écrivez du code JavaScript pour ajouter des fonctionnalités à votre extension. Vous pouvez utiliser JavaScript pour interagir avec des pages Web, manipuler des données, etc. - Fichier manifeste :
Permettez-moi de le raconter d’une manière intéressante au lieu d’un blog ennuyeux normal.
Ahh……!!! OK, considérons le thème de l’espace puisque nous sommes désormais une grande superpuissance dans l’exploration spatiale avec le succès de Chandrayan 3
Le plan d’aventure de votre extension !
Imaginez votre extension Chrome comme un vaisseau spatial sur le point de se lancer dans un voyage intergalactique. Quelle est la première chose dont vous avez besoin avant de vous lancer dans l’immensité du Web ? Un plan de vol minutieusement détaillé ! Dans l’univers des extensions Chrome, il s’agit de votre fichier manifeste. Il s’agit généralement d’un fichier JSON.
Version du manifeste: C’est comme choisir votre modèle de vaisseau spatial. Dans le monde en constante évolution des extensions Chrome, la version 3 du manifeste est le nouveau modèle brillant. Mais n’oubliez pas de vérifier s’il existe une nouvelle version du manifeste, car la technologie ne s’arrête jamais !
Nom et version: Votre vaisseau spatial a besoin d’un nom sympa et d’un numéro de version qui indique au monde qu’il s’améliore constamment. Pense “VikramAditya 2.0» plutôt que « GenericBrowserAddOn ».
Autorisations: Tout comme votre vaisseau spatial a besoin d’une autorisation pour entrer dans divers systèmes stellaires, votre extension a besoin d’une autorisation pour accéder à certaines parties du Web. Soyez respectueux, ne demandez que les autorisations dont vous avez réellement besoin. C’est comme demander gentiment avant d’entrer chez quelqu’un.
Icônes: Chaque vaisseau spatial a besoin d’un emblème, n’est-ce pas ? Spécifiez des icônes pour votre extension, la rendant instantanément reconnaissable dans le vaste univers Chrome. Différentes tailles pour différents vaisseaux spatiaux, comme avoir à la fois un écusson de mission et un drapeau sur votre vaisseau.
Pages contextuelles et d’options: Ce sont comme le cockpit et le panneau de commande de votre vaisseau spatial. Spécifiez quels fichiers HTML serviront de centre de commande de votre vaisseau spatial.
Scripts d’arrière-plan: Certaines tâches sont mieux gérées en coulisses. Les scripts d’arrière-plan sont comme l’IA de votre vaisseau, travaillant sans relâche pour garantir que tout se passe bien.
Scripts de contenu: Ce sont vos « équipes à l’extérieur ». Ils plongent dans les pages Web pour interagir avec elles. Considérez-les comme les explorateurs de votre extension, allant hardiment là où aucune extension n’est allée auparavant.
Actions du navigateur et actions de page: Si votre extension a besoin de boutons et de gadgets dans la barre d’outils Chrome ou dans les menus contextuels, c’est ici que vous leur donnez vie. Des boutons emblématiques qui attirent l’attention !
Autorisations de l’hôte: Lorsque vous communiquez avec d’autres galaxies (sites Web ou API), répertoriez les autorisations dont vous avez besoin. C’est comme une autorisation diplomatique pour votre vaisseau spatial.
Autorisations facultatives: Ce sont comme les avantages que vous offrez aux passagers. Les utilisateurs peuvent choisir de les activer ou de les désactiver, leur donnant ainsi plus de contrôle sur leur expérience d’extension.
Mettre à jour l’URL: Gardez votre vaisseau spatial à jour en précisant où il peut trouver les dernières améliorations. Considérez-le comme le centre de contrôle de mission de votre extension, garantissant qu’elle est toujours prête pour la prochaine aventure.
Validation du manifeste: Juste avant le décollage, faites examiner votre fichier manifeste par l’outil Chrome Extension Manifest Validator. C’est comme la vérification finale du système avant que votre vaisseau spatial ne prenne vie.
Dans ce voyage passionnant à travers le cosmos des extensions Chrome, votre fichier manifeste est votre étoile directrice. Ce n’est pas seulement un document; c’est le modèle de l’aventure épique de votre extension dans l’univers en constante expansion du Web. Alors, avec votre fichier manifeste comme guide fidèle, commencez à créer votre extension Chrome et préparez-vous pour une aventure aux proportions cosmiques !
Vous trouverez ci-dessous un exemple de fichier manifeste.
Exemple de Manifest.jsonComment tester nos extensions localement :
Ouvrez Chrome, accédez à chrome://extensions/activer Mode développeuret cliquez sur “Chargement déballé.” Sélectionnez le répertoire de votre extension. Ce faisant, vous pourrez tester minutieusement votre extension avant de la publier.
Nous avons préparé notre vaisseau spatial d’extension, il ne reste plus qu’à le lancer. explorons comment déployer nos extensions.
Comment publier une extension Chrome
Nous pouvons publier nos extensions Chrome dans le Boutique en ligne Chrome qui ressemble au Play Store pour les extensions. La première chose dont nous avons besoin est un compte développeur. Si vous n’en avez pas, créez-le en visitant le Tableau de bord des développeurs du Chrome Web Store et payer les frais d’inscription uniques, qui sont de 5 dollars.
Tableau de bord du développeur ChromeConnectez-vous ensuite au tableau de bord du développeur du Chrome Web Store à l’aide de votre compte de développeur. Cliquez sur le bouton « Ajouter un nouvel élément » dans le coin droit de la section des éléments du tableau de bord. Ensuite, vous devez télécharger les fichiers d’extension au format zip. Comment procéder ?
Emballez votre extension :
- Organisez tous vos fichiers d’extension, y compris le fichier manifeste, HTML, CSS, JavaScript et les icônes, dans un seul répertoire.
- Créez un fichier ZIP contenant tous ces fichiers. Ce fichier ZIP sera téléchargé sur le Chrome Web Store.
Téléchargez ensuite le fichier créé ci-dessus FERMETURE ÉCLAIR fichier dans la zone de dépôt de fichiers que vous voyez lorsque vous cliquez sur ajouter un nouvel élément. Ensuite, nous devons remplir Détails de l’extension.
Nous devrons fournir les détails suivants :
- Ajoutez une description détaillée de votre extension.
- Téléchargez des captures d’écran ou des images pour présenter votre extension.
- Définissez la visibilité de votre extension (publique ou non répertoriée).
- Choisissez une catégorie et une langue pour votre extension.
Enfin, vérifiez toutes les informations que vous avez fournies, assurez-vous qu’elles sont exactes et cliquez sur le bouton «Publier” bouton. Une fois votre publication effectuée, l’examen par Google prendra 24 heures. Vous recevrez un e-mail indiquant si l’examen a réussi ou échoué. En cas d’échec, la raison de l’échec sera également fournie par l’équipe d’évaluation dans l’e-mail.
De mon expérience personnelle fournira un ensemble de conseils pour réussir l’examen.
- Testez votre extension de manière approfondie : Pour qu’il soit exempt de bogues comme les erreurs de politique de sécurité du contenu (CSP), etc. et qu’il fonctionne dans tous les environnements.
- Réduire les autorisations : Ne demandez que les autorisations absolument nécessaires au fonctionnement de votre extension. La réduction des autorisations réduit les chances que votre extension soit rejetée lors de l’examen.
- Utilisez des descriptions claires et non trompeuses: Rédigez des descriptions claires et concises qui représentent avec précision les fonctionnalités de votre extension. Évitez d’utiliser un langage trompeur ou des exagérations.
- Utilisez des icônes et des captures d’écran de haute qualité : Les icônes et les captures d’écran sont les premières choses que voient les utilisateurs. Assurez-vous qu’ils sont en haute résolution, clairs et représentent votre extension avec précision.
- Examinez attentivement les politiques de Google : Assurez-vous que votre extension est conforme à ces politiques pour éviter des rejets potentiels.
Partager certaines de mes extensions préférées
Il y en a beaucoup d’autres, faites-le moi savoir si vous souhaitez des extensions plus utiles, je créerai un nouveau blog avec toutes les extensions complètes. Commentez vos favoris.
En résumé, la création et le déploiement d’une extension Chrome sont un processus gratifiant, mais cela nécessite une planification minutieuse et le respect des politiques de Google. Du concept au déploiement, suivez les meilleures pratiques, minimisez les autorisations, donnez la priorité à la confidentialité des utilisateurs et soyez patient pendant le processus de révision. Ce faisant, vous pouvez partager avec succès votre extension avec un public mondial et contribuer à l’écosystème d’extensions Chrome.
Bon développement !
Merci!
to medium.com
Abonnez-vous à notre page Facebook: https://www.facebook.com/mycamer.net
Pour recevoir l’actualité sur vos téléphones à partir de l’application Telegram cliquez ici: https://t.me/+KMdLTc0qS6ZkMGI0
Nous ecrire par Whatsapp : Whatsapp +44 7476844931