Boostez votre IDE
S’il y a bien un endroit où vous allez passer du temps, c’est votre IDE (éditeur de code), il est donc important de ne pas négliger son environnement de travail. Alors que vous devriez être concentré sur votre code, on se retrouve souvent à perdre beaucoup de temps sur des actions répétitives qui pourraient être automatisées, ou alors on ne connaît tout simplement pas encore les astuces qui nous rendront 2 fois plus efficace. Nous allons vous présenter des astuces allant des raccourcis clavier à connaître, aux plugins essentiels à avoir.
Cet article se concentrera sur les solutions pour Visual Studio Code. Il est cependant important de noter que certains raccourcis et plugins peuvent être disponibles sur d’autres IDE, tels que les logiciels de la suite IntelliJ.
1 - Les raccourcis a connaître
Lorsque chaque seconde compte dans le processus de développement, connaître et utiliser judicieusement les raccourcis clavier peut faire toute la différence. Voici quelques raccourcis essentiels qui vous permettront d’accélérer votre flux de travail et d’optimiser votre temps :
Mettre en commentaire
Pour pouvoir gagner du temps en codant, il est crucial de savoir comment mettre en commentaire des lignes ou des blocs de code. Voici comment le faire rapidement dans VSCode :
Windows/Linux : Ctrl + / macOS : Command + /
Sélectionnez les lignes de code que vous souhaitez commenter et utilisez ce raccourci pour les mettre en commentaire en un instant.
Rechercher dans VSCode
Si vous êtes amené à travailler sur de gros projets, vous pouvez vite vous retrouver dépassé par le nombre de fichiers dans tous les sens. Pour régler ça, rien de plus simple que de rechercher directement le nom des fichiers dans VSCode ! Utilisez ce raccourci pour accéder rapidement à l’outil de recherche :
Windows/Linux : Ctrl + P macOS : Cmd + P
Ce raccourci ouvrira une barre de recherche, vous permettant de trouver n’importe quel fichier rapidement.
NB : Si vous souhaitez rechercher du texte à l’intérieur de vos fichiers, vous pouvez tout simplement cliquer sur l’icône recherche à gauche.
Sélectionner toutes les occurrences d’un mot
Vous souhaitez effectuer une modification sur plusieurs occurrences d’un même élément dans votre fichier ? Voici comment sélectionner toutes les occurrences simultanément :
Windows/Linux : Ctrl + Shift + L
macOS : Command + Shift + L
Utilisez ce raccourci après avoir sélectionné un mot pour automatiquement sélectionner toutes les autres occurrences dans le fichier. Gagnez du temps et assurez la cohérence de votre code en quelques secondes.
Custom Snippets : Vos extraits de code personnalisés
Les snippets, ou extraits de code, sont des portions de code pré-écrites que vous pouvez insérer rapidement dans votre éditeur de texte. Ils peuvent contenir des structures de base, des modèles de code couramment utilisés ou tout autre segment de code que vous souhaitez réutiliser.
Créer vos propres snippets dans VSCode est un excellent moyen d’automatiser l’insertion de ces morceaux de code récurrents et d’améliorer votre productivité. Voici comment les créer :
Accédez aux snippets personnalisés :
Allez dans le menu “Fichier” (File) > “Préférences” (Preferences) > “Fichiers et dossiers de l’utilisateur” (User Snippets). Sélectionnez le langage pour lequel vous souhaitez créer un snippet.
Créez votre snippet :
Dans le fichier de langage spécifique, définissez le snippet en utilisant le format JSON. Voici un exemple de snippet pour une boucle “for” en JavaScript :
{
"For loop": {
"prefix": "for",
"body": [
"for (let i = 0; i < ${1:length}; i++) {",
"\t$0",
"}"
],
"description": "Create a for loop"
}
}- “prefix” définit le mot-clé qui déclenchera l’insertion du snippet (ici, “for”).
- “body” contient le contenu du snippet, où ${1:length} est un paramètre que vous pouvez remplir.
- “description” est une description facultative du snippet. Avec ce snippet, lorsque vous tapez “for” et appuyez sur Tab, le code de la boucle “for” sera généré automatiquement avec le curseur positionné pour vous permettre de remplir la longueur de la boucle.
Les snippets personnalisés peuvent être aussi simples ou complexes que nécessaire. Ils vous font gagner du temps en évitant de taper plusieurs fois le même code et en améliorant la cohérence de votre code.
2 - Les plugins essentiels
Les plugins, ou extensions, sont des éléments clés pour personnaliser et étendre les fonctionnalités de VSCode. Voici quelques plugins essentiels qui peuvent améliorer votre expérience de développement :
Git Lens
Git Lens est un plugin puissant qui vous donne un aperçu en profondeur des modifications Git directement dans votre éditeur. Il affiche des informations sur les auteurs, les dernières modifications et bien plus encore, vous permettant de mieux comprendre l’historique de votre code.
Cette extension s’avère particulièrement utile lors de gros projets de groupe ou lorsque vous serez amené à travailler en entreprise. Elle n’est pas essentielle, mais elle vous offrira vraiment une meilleure clarté sur votre projet en vous fournissant une représentation visuelle.
Pour installer Git Lens, accédez à l’onglet des extensions (Ctrl + Shift + X ou Command + Shift + X) et recherchez “Git Lens”.
ESLint
ESLint est un outil qui analyse votre code (pour le javaScript) et qui identifie et corrige les problèmes les plus courants (la syntaxe entre autres). L’intégration d’ESLint dans VSCode vous permet de détecter et de résoudre rapidement les erreurs et les incohérences dans votre code, vous épargnant ainsi une partie du débogage due à l’inattention.”.
Pour installer ESLint, accédez à l’onglet des extensions et recherchez “ESLint”.
Auto Rename Tag
Lorsque vous travaillez avec des balises HTML, renommer une balise doit être simple et rapide. Auto Rename Tag est une extension qui simplifie cette tâche en renommant automatiquement la balise correspondante dès que vous modifiez l’une des occurrences.
Pour installer Auto Rename Tag, accédez à l’onglet des extensions et recherchez “Auto Rename Tag”.
Notre coup de coeur
GitHub Copilot
GitHub Copilot est une extension propulsée par l’intelligence artificielle développée par GitHub et OpenAI. Elle vise à simplifier et accélérer le processus de rédaction de code en fournissant des suggestions de code en temps réel basées sur le contexte et les commentaires.
L’une des fonctionnalités les plus impressionnantes de GitHub Copilot est sa capacité à générer du code en fonction des quelques mots que vous saisissez. Vous pouvez commencer à écrire une fonction et Copilot vous proposera des suggestions pour compléter le reste.
La clé : Bien nommer vos variables et fonctions
Pour que GitHub Copilot fournisse des suggestions précises et utiles, il est essentiel de bien nommer vos variables, fonctions et classes. Utiliser des noms descriptifs et significatifs permet à l’IA de mieux comprendre le contexte de ce que vous essayez de réaliser. Plus vos noms de variables sont explicites, plus les suggestions de Copilot seront précises.
Par exemple, si vous créez une fonction pour calculer la somme de deux nombres, nommez-la “calculateSum” au lieu de quelque chose de générique comme “calculate”. Cela aidera Copilot à générer des suggestions en rapport avec le calcul de la somme.
Utilisez GitHub Copilot avec discernement
Bien que GitHub Copilot soit une ressource incroyablement utile, il est important de l’utiliser avec discernement, surtout si vous débutez. Il est crucial de comprendre et de maîtriser les bases du langage que vous utilisez, ainsi que les algorithmes et les structures de données courantes, au lieu de compter uniquement sur les suggestions de Copilot.
Dépendre trop de Copilot peut vous empêcher d’apprendre et de comprendre en profondeur ce que vous faites. Prenez le temps d’écrire du code par vous-même et de résoudre des problèmes sans l’aide de l’IA. L’utilisation judicieuse de GitHub Copilot peut augmenter votre productivité, mais il est important de ne pas sacrifier votre propre apprentissage et compréhension.
GitHub Copilot offre un potentiel impressionnant, mais il est essentiel de l’utiliser de manière responsable et éduquée. En comprenant ses avantages et ses limites, vous pourrez en tirer le meilleur parti !
Si vous êtes étudiant vous pouvez profiter gratuitement de Copilot. Rendez-vous sur GitHub Student Developer Pack, suivez les instructions et profitez de nombreux avantages !
Si vous n’êtes pas étudiant , il vous faudra malheureusement déboursé 10 $ par mois.
Même si la liste des extensions, des raccourcis et des astuces pour utiliser VSCode à son plein potentiel est encore longue, vous devriez déjà gagner pas mal de temps avec tout cela ! N'hésitez pas à plonger dans les réglages pour personnaliser au maximum votre IDE, et partez explorer le vaste choix d'extensions qui existent. Si vous rencontrez un problème, il y a de grandes chances qu'une extension ait la solution !
Vous pouvez retrouvez nos autres articles :