Les snippets
if (...) { ... }Tout le monde connaît, personne ne fait
Qui suis-je ?
Pierre Poupin
Développeur Web/Mobile
/pierpo
/pierpo/react-archer
Qu'est-ce qu'un snippet?
if (...) {
...
}Un morceau de code à trous
if<TAB>
Je peux en faire sur mon éditeur ?
Oui, c'est sur tous les éditeurs 😊
(pas Notepad désolé 😭 )
Et concrètement, c'est où ?
- VSCode : Google "vscode snippets"
- Webstorm (IntelliJ) : Google "intellij code templates"
- Vim : UltiSnips, Snipmate, Neosnippets
// Syntaxe VSCode pour un snippet
console.log('$1', $1)Un premier exemple
Probablement LE snippet que j'utilise le plus...
Pourquoi faire des snippets ?
1 - Gagner en confort et taper plus vite
Pourquoi faire des snippets ?
1 - Gagner en confort et taper plus vite
Avec snippet
Sans snippets
(par flemme)
2 - Rester concentré sur le fond et pas la forme
Pourquoi faire des snippets ?
2 - Rester concentré sur le fond et pas la forme
"Je veux ouvrir un fichier en Nodejs"
2 - Rester concentré sur le fond et pas la forme
"Je veux traduire une chaîne de caractères"
2 - Rester concentré sur le fond et pas la forme
Abstraction au dessus du langage
Nodejs
Python
2 - Rester concentré sur le fond et pas la forme
Pas d'interruptions comme :
• aller chercher dans la doc (ahem, Stackoverflow* pardon)
• aller faire un copier/coller d'un autre bout de code similaire
3 - Rester cohérent et ne pas se tromper
Pourquoi faire des snippets ?
3 - Rester cohérent et ne pas se tromper
3 - Rester cohérent et ne pas se tromper
Fournir un standard au sein d'une équipe
Je connais mais je n'en fais pas 😭
Je connais mais je n'en fais pas :'(
1 - Faire des snippets doit être facile
VSCode est un très mauvais élève. Utiliser :
• Easy Snippet Maker (extension)
• VS-Snippeteer (web app)
Je connais mais je n'en fais pas :'(
2 - Prenez du recul sur vos répétitions et vos galères
Accolades/crochets sur Mac en AZERTY bonjour 👋
Je connais mais je n'en fais pas :'(
3 - Quand vous créez un snippet, utilisez-le immédiatement
Forcez-vous à effacer et réécrire grâce au snippet le code que vous venez de taper
Je connais mais je n'en fais pas :'(
3 - Quand vous créez un snippet, utilisez-le immédiatement
Deux raisons majeures :
• tester que le snippet marche et vous convient
• acquérir le réflexe de s'en servir
Je connais mais je n'en fais pas :'(
4 - N'utilisez pas les snippets des autres
Sauf les snippets très génériques comme "if"
Pensez à regarder les features plus avancées des snippets
- utiliser la sélection courante dans un snippet
- utiliser le nom du fichier courant dans un snippet
- ...
Merci 😊
Snippet syntax example
if (...) {
...
}function ... (...) {
...
}if ($1) {
$2
}function $1 ($2) {
$3
}VSCode
abstract snippet
snippet
Snippet syntax example
if (...) {
...
}function ... (...) {
...
}if ($COND$) {
$BODY$
}function $NAME$ ($ARGS$) {
$BODY$
}