{"id":158087,"date":"2020-05-19T10:08:30","date_gmt":"2020-05-19T10:08:30","guid":{"rendered":"https:\/\/blog.jetbrains.com\/webstorm\/2020\/05\/plugins-for-webstorm-you-need-to-know-about\/"},"modified":"2021-06-28T10:46:33","modified_gmt":"2021-06-28T09:46:33","slug":"plugins-for-webstorm-you-need-to-know-about","status":"publish","type":"webstorm","link":"https:\/\/blog.jetbrains.com\/fr\/webstorm\/2020\/05\/plugins-for-webstorm-you-need-to-know-about\/","title":{"rendered":"S\u00e9lection de plugins pour WebStorm \u00e0 conna\u00eetre"},"content":{"rendered":"

Avec WebStorm, vous pouvez commencer \u00e0 travailler sans avoir \u00e0 installer de plugin suppl\u00e9mentaire car toutes les fonctionnalit\u00e9s essentielles sont directement op\u00e9rationnelles. Mais qu’en est-il si vous souhaitez que votre outil soit un peu plus personnalis\u00e9 ou si vous avez besoin de fonctionnalit\u00e9s suppl\u00e9mentaires ? <\/span>Gr\u00e2ce aux formidables membres de notre communaut\u00e9, nous avons de nombreux plugins qui r\u00e9pondent \u00e0 ces besoins !<\/p>\n

Dans cet article, nous vous proposons de d\u00e9couvrir quelques-uns des plugins pour les IDE de JetBrains les plus pratiques. Tous ces plugins sont compatibles avec d’autres IDE de JetBrains, comme PhpStorm et IntelliJ IDEA Ultimate, et peuvent \u00eatre install\u00e9s \u00e0 partir de Preferences\/Settings <\/em>Plugins<\/em>. Il s’agit d’une s\u00e9lection car notre r\u00e9f\u00e9rentiel<\/a> comprend des centaines de plugins !<\/p>\n

Plugins de th\u00e8mes<\/a><\/h2>\n

Vous avez envie d’autre chose que des th\u00e8mes propos\u00e9s par d\u00e9faut ? Il existe de nombreux autres th\u00e8mes parmi lesquels vous pouvez choisir. Parmi les plus populaires, on trouve Material Theme UI<\/a>, One Dark<\/a>, Gradianto<\/a> et Dark Purple<\/a>. Si aucun ne vous convient vous pouvez \u00e9galement cr\u00e9er votre propre th\u00e8me<\/a>.<\/p>\n

\"switching-themes\"<\/p>\n

Une fois install\u00e9, le th\u00e8me sera disponible dans le menu d\u00e9roulant Theme<\/em> sous Preferences\/Settings | Appearance & Behavior | Appearance.<\/em><\/p>\n

Key Promoter X<\/a><\/h2>\n

L’utilisation intensive du clavier permet d’am\u00e9liorer consid\u00e9rablement la productivit\u00e9, mais il n’est pas \u00e9vident de se familiariser avec toutes les nouvelles combinaisons de raccourcis. C’est l\u00e0 que plugin Key Promoter X peut \u00eatre d’une grande aide. Lorsque vous utiliser la souris et cliquez sur un \u00e9l\u00e9ment dans l’IDE, il affiche la combinaison de touches que vous auriez pu utiliser. Et pour les boutons qui n’ont pas de raccourci, le plugin sugg\u00e8re de leur en attribuer un. Cela vous aide \u00e0 r\u00e9duire progressivement l’usage de la souris et, \u00e0 plus long terme, \u00e0 coder plus rapidement.<\/p>\n

\"key-promoter-x\"<\/p>\n

Rainbow Brackets<\/a><\/h2>\n

Ce plugin attribue une couleur unique \u00e0 chaque paire de parenth\u00e8ses, ce qui aide \u00e0 voir plus facilement o\u00f9 commence et o\u00f9 finit un bloc de code.<\/p>\n

\"rainbow-brackets\"<\/p>\n

Si vous utilisez les couleurs par d\u00e9faut, notez que le plugin fonctionne mieux en combinaison avec les th\u00e8mes sombres. Si vous utilisez un th\u00e8me clair ou si voulez essayer les th\u00e8mes par d\u00e9faut, vous pouvez cr\u00e9er votre propre jeu de couleurs. Pour ce faire, allez dans Preferences\/Settings | Editor | Color Scheme | Rainbow Brackets<\/em>.<\/p>\n

Indent Rainbow<\/a><\/h2>\n

Ce plugin a un fonctionnement similaire \u00e0 celui de Rainbow Brackets, mais s’applique aux indentations. Sa principale utilit\u00e9 est de rendre l’indentation plus lisible. Si une indentation incorrecte est utilis\u00e9e, le plugin mettra en \u00e9vidence la ligne en rouge pour permettre de d\u00e9tecter plus rapidement les probl\u00e8mes d’indentation.<\/p>\n

\"indent-rainbow\"<\/p>\n

Comme avec Rainbow Brackets, les couleurs par d\u00e9faut s’accordent mieux avec les th\u00e8mes sombres. Vous pouvez tester l’opacit\u00e9 des couleurs d’indentation dans Preferences\/Settings | Other Settings | Indent Rainbow<\/em> et l’ajuster aux th\u00e8mes clairs ou en fonction de vos besoins.<\/p>\n

Nyan Progress Bar<\/a><\/h2>\n

Vous aimeriez que votre barre de progression soit plus attrayante ? Le plugin Nyan Progress Bar peut vous y aider.<\/p>\n

\"nyan-progress-bar\"<\/p>\n

Si Nyan Cat n’est pas \u00e0 votre go\u00fbt, il existe d’autres alternatives, notamment les plugin Hadouken<\/a> et Duck Progress Bar<\/a>.<\/p>\n

String Manipulation<\/a><\/h2>\n

Si vous avez besoin d’aide pour des actions d’\u00e9dition de texte avanc\u00e9es, comme le passage de camelCase \u00e0 kebab-lowercase, String Manipulation est le plugin qu’il vous faut. Vous pouvez trouver plus d’informations sur les actions prises en charge ici<\/a>.<\/p>\n

\"string-manipulation\"<\/p>\n

Quick File Preview<\/a><\/h2>\n

Ce plugin aide \u00e0 parcourir le contenu de chaque fichier plus rapidement. Plus pr\u00e9cis\u00e9ment, il vous permet de pr\u00e9visualiser les fichiers du projet dans l’\u00e9diteur lorsque vous les s\u00e9lectionnez dans la vue Project<\/em>.<\/p>\n

\"quick-file-preview\"<\/p>\n

Atom Material Icons<\/a><\/h2>\n

Vous voulez \u00e9gayer votre th\u00e8me avec des ic\u00f4nes plus color\u00e9es ? Essayez le plugin Atom Material Icons.<\/p>\n

\"atom-material-icons\"<\/p>\n

Le plugin Extra Icons<\/a> constitue une bonne alternative. Notez toutefois qu’il prend en charge moins d’ic\u00f4nes JavaScript.<\/p>\n

Codota<\/a><\/h2>\n

Si vous avez envie d’exp\u00e9rimenter la saisie semi-automatique du code bas\u00e9e sur l’intelligence artificielle, le plugin Codota est une bonne solution pour commencer. Il rend les suggestions de saisie de WebStorm encore plus pertinentes et vous aide ainsi \u00e0 augmenter votre vitesse de codage. Pour en savoir plus sur le fonctionnement de ce plugin, consultez la page d\u00e9di\u00e9e<\/a> et le site web de Codota<\/a>.<\/p>\n

\"codota-completion-suggestions\"<\/p>\n

Si vous d\u00e9cidez d’essayer Codota, sachez qu’en activant l’option de saisie automatique avanc\u00e9e vous acceptez d’envoyer<\/strong> des informations suppl\u00e9mentaires<\/strong> au serveur. Cliquez ici<\/a> pour en savoir plus et d\u00e9cider si c’est ok pour vous.<\/p>\n

AceJump<\/a><\/h2>\n

Le plugin AceJump est une bonne option si vous avez envie de tester des fonctionnalit\u00e9s de navigation. Il vous permet d’acc\u00e9der \u00e0 n’importe quel symbole dans l’\u00e9diteur en quelques clics seulement. Pour en savoir plus sur le fonctionnement de ce plugin, consultez les instructions d’utilisation d\u00e9taill\u00e9es disponibles ici<\/a>.<\/p>\n

\"acejump-plugin\"<\/p>\n

IDEA Mind Map<\/a><\/h2>\n

Vous aimez organiser vos id\u00e9es en utilisant des sch\u00e9mas conceptuels ? Si c’est le cas, vous devriez trouver le plugin IDEA Mind Map utile car il permet de cr\u00e9er et de modifier des cartographies conceptuelles repr\u00e9sent\u00e9es par des fichiers MMD.<\/p>\n

\"mind-map-idea-plugin\"<\/p>\n

Randomness<\/a><\/h2>\n

Si il vous arrive souvent d’avoir des difficult\u00e9s \u00e0 trouver des donn\u00e9es al\u00e9atoires pour vos projets, ce plugin est fait pour vous. Il permet d’ins\u00e9rer des nombres al\u00e9atoires, des cha\u00eenes et des UUID.<\/p>\n

\"randomness-plugin\"<\/p>\n

Pour ins\u00e9rer des donn\u00e9es al\u00e9atoires, appuyez sur Alt+R<\/em> et choisissez le type de donn\u00e9es que vous souhaitez ins\u00e9rer. Une valeur diff\u00e9rente sera ins\u00e9r\u00e9e chaque fois que vous utiliserez l’action.<\/p>\n

Presentation Assistant<\/a><\/h2>\n

Vous devez faire des pr\u00e9sentations pour des \u00e9v\u00e9nements, enregistrer des screencasts ou programmer en bin\u00f4me ? Le plugin Presentation Assistant affiche les raccourcis que vous utilisez pour permettre \u00e0 votre audience de suivre vos actions plus facilement.<\/p>\n

\"string-manipulation\"<\/p>\n

Et vous, quels sont vos plugins pour WebStorm pr\u00e9f\u00e9r\u00e9s ? Dites-le nous dans les commentaires !<\/p>\n

L’\u00c9quipe WebStorm<\/em><\/p>\n","protected":false},"author":813,"featured_media":153560,"comment_status":"open","ping_status":"closed","template":"","categories":[601],"tags":[355,743,91],"cross-post-tag":[],"acf":[],"_links":{"self":[{"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/webstorm\/158087"}],"collection":[{"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/webstorm"}],"about":[{"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/types\/webstorm"}],"author":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/users\/813"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/comments?post=158087"}],"version-history":[{"count":2,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/webstorm\/158087\/revisions"}],"predecessor-version":[{"id":158091,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/webstorm\/158087\/revisions\/158091"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/media\/153560"}],"wp:attachment":[{"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/media?parent=158087"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/categories?post=158087"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/tags?post=158087"},{"taxonomy":"cross-post-tag","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/cross-post-tag?post=158087"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}