Aujourd'hui, je vous propose de découvrir une dizaine d'extensions pour le navigateur Google Chrome qui vous permettront de gagner du temps lors de vos intégrations.
La console de developpement Google Chrome
Je pense que tous les développeurs Javascript et les intégrateurs parmi vous connaissent déjà les outils de développeurs de Chrome.
Cette petite console que l'on peut afficher avec CTRL+SHIFT+i, ou bien en allant du menu "plus d'outils" permet d'effectuer de nombreuses tâches utiles lors du développement d'un site, de l'audit à l'édition live du DOM et du CSS.
Même si vous pensez bien les connaitre, attention, les outils pour développeurs de google chrome sont plus puissant que beaucoup ne le supposent !
Saviez-vous par exemple qu'il est possible d'enregistrer les modifications effectuées dans l'éditeur CSS directement dans les fichiers ? Si cela vous intéresse, je vous propose la documentation officielle des outils de développement (en anglais) ainsi qu'une réponse très documentée et illustré sur Stack Overflow (en anglais aussi).
https://developer.chrome.com/devtools/docs/workspaces
http://stackoverflow.com/questions/6843495/how-to-save-css-changes-of-styles-panel-of-chrome-developer-tools
Sachez aussi qu'il est possible de travailler directement avec vos fichiers SASS où SCSS a la place des fichiers générés, grace à l'utilisation de fichiers map. Pour plus d'informations, je vous propose le lien suivant (en anglais aussi).
https://developer.chrome.com/devtools/docs/css-preprocessors
Jason est un analyseur, lecteur et débuguer pour les fichiers json et XML.
Pendule est une extension pleine de possibilités. Édition de CSS, analyse et débug de formulaires, suppression de cookies, cette extension peut à elle seule suffire à tous vos besoins !
CSS Dig est une application permettant d'analyser les fichiers CSS de votre page, pour en tirer les différents styles redondants.
CSS-Shake est un éditeur graphique sous la forme d'application chrome, que vous pourrez donc lancer depuis votre navigateur. Je le trouve malheureusement un peu basique, ce qui est tres dommage vu le niveau de finitions.
Cette petite extension vide simplement les cookies que vous avez sur une page spécifique, ni plus ni moins. Croyez-moi, c'est bien plus agréable que de devoir vider les cookies depuis la console de développement Javascript a chaque appel !
Vous êtes-vous déjà demande quelles étaient les polices d’écriture utilisées sur tel ou tel site ? Cette petite extension vous permettra de combler votre curiosité le plus rapidement possible.
Cette application vous permettra de mesurer très précisément les espaces et éléments de votre site Web.
Cette extension est une véritable boite à outils pour tout ce qui touche à la couleur. Récupérez la palette utilisée sur un site où simplement une couleur grace à un color-picker, générez des gradients CSS, et beaucoup d'autres choses !