Astuces

Sur cette page, je partagerai quelques conseils et astuces que j'ai trouvés en essayant de comprendre comment les choses fonctionnent.

• Tip #4 - Télécharger une police à partir de Google Font

  • font

  6 février 2023

  Vous n’avez pas toujours besoin d’une police personnalisée pour votre site web. Mais lorsque c’est le cas, il est parfois difficile de la télécharger.

  Pour certaines raisons (performance, confidentialité des données, etc.), vous pouvez vouloir stocker la police sur votre propre serveur (ce que je recommande fortement). Si vous voulez le faire, Google Fonts vous permet de télécharger la police sous forme de fichier .woff2, ce qui est très pratique.

  Cependant, au moment de la rédaction de cette astuce, le fichier de police que vous téléchargez directement sur Google Fonts contient toutes les gammes unicode (cyrillique, vietnamien, etc.) et vous n’aurez peut-être pas besoin de toutes les utiliser. Cela augmente le temps d’affichage du premier contenu de votre site web !

  Pour télécharger le minimum de fichiers dont vous avez besoin, ajoutez les tags link de google fonts sur votre site web (ceux qui permettent d’ajouter la police via Google Fonts), inspectez le réseau et vérifiez l’appel d’api réellement effectué. Ouvrez un nouvel onglet, copiez cette URL. Le téléchargement du fichier de police devrait commencer immédiatement ! Copiez ce fichier dans la partie statique de votre serveur et supprimez les balises link de google fonts.

  Copiez ensuite ceci dans votre css :

  html {
  	font-name: '<font name>', 'sans-serif';
  }
  @font-face {
  	font-family: <font name>;
  	font-style: normal;
  	font-weight: 400;
  	font-display: swap;
  	src: url('<location to where you stored your font>') format('woff2');
  	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F,
  		U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }

  Vous pouvez l’adapater si vous avez plusieurs grasses (thin, light, normal, bold) de polices ! Vous pouvez d’ailleurs le retrouver dans les requêtes faites au serveurs Google Font.

  Veillez à utiliser les polices de remplacement appropriées, les plus proches de votre famille de polices !

• Tip #3 - Obtenir la liste des forks Github d'un repo

  • github

  1 février 2023

  Pour obtenir la liste des forks Github d’un dépôt, remplacez le propriétaire et le nom du dépôt dans l’url suivante et copiez-la dans un navigateur :

  https://api.github.com/repos/<propriétaire>/<nom du repo>/forks

  Voici un exemple pour la librairie svelte-awesome-color-picker.

• Tip #2 - Définir un alias git avec un paramètre

  • git

  29 janvier 2023

  Si l’argument vient en argument final de la commande git, vous pouvez définir l’alias comme suit :

  git config --global alias.<nom d'alias> '<command>'
  
  # exemple
  git config --global alias.cm 'commit -m'
  
  # utilisation
  git cm "message de commit"

  Sinon, deux solutions s’offrent à vous. La première permet de définir l’alias en ligne de commande (attention aux deux ”;”) :

  git config --global alias.<nom d'alias> '!f() { <commande avec $1 pour le premier paramètres>; }; f'
  
  # exemple
  git config --global alias.aliasd '!f() { git config --global --unset alias.$1; }; f'
  
  # utilisation
  git aliasd <nom d'alias>

  La seconde est plus concise mais devra directement être ajouté dans votre fichier .gitconfig :

  [alias]
  	<nom d'alias> = "!<commande avec $1 pour le premier paramètres>"
  
  # exemple
    aliasd '!git config --global --unset alias.$1'
  
  # utilisation
  git aliasd <nom d'alias>

• Tip #1 - Comment mettre à jour toutes les dépendances

  • pnpm

  29 janvier 2023

  Utilisez l’argument optionnel --latest pour ignorer les plages spécifiées dans le fichier package.json.

  pnpm up --latest