Blog
et dernières actualités

Du contenu autour de l'économie sociale et solidaire (ESS), des réflexions et astuces de développement Drupal.

Vues

Remplacer son code jQuery par du code natif "vanilla"

Drupal 9 a initié une tendance de fond depuis plusieurs années au sein de sa base de code qui consiste à retirer sa dépendance à jQuery afin d'alléger le poids des pages (en l'invoquant à la carte) puis en le remplaçant par des implémentations dites vanilla (en javascript natif pur).

Cette tendance de fond est possible car les navigateurs ont bien progressé et leurs implémentations sont uniformisées, au point que les années de jQuery soient comptées (pas seulement à cause de cela).

Par réflexe ou par habitude, beaucoup de développeurs (back) savent développer certains comportements interactifs avec jQuery mais ne savent pas le faire de façon vanilla. Ces liens recensent quelques techniques et snippets d'équivalence pour les taches les plus courantes.

 

Jongler entre plusieurs version de Node.js

Ce court article présente les utilitaires nvm et n qui permettent de simplifier la gestion des différentes versions de Node.js entre divers projets.

Utiliser du SVG pour ses favicons

Qui ne s'est jamais dit "roh mais ce favicon est illisible !" ? Une icône de 16x16 ou 32x32 ne laisse pas forcément beaucoup de place pour s'exprimer. Et puis il faut gérer toutes les variantes selon les usages possibles (coucou iOS et consorts). Cela dit, même si la place ne s'est pas agrandie, la netteté des icônes va grandement y gagner grâce au SVG !

Plus besoin de passer par des sites type https://www.favicon-generator.org/, une image résoudra tous vos problèmes de taille (de favicon). Bonus : c'est supporté par tous les navigateurs.

Augmenter la lisibilité des nombres dans les tableaux

Vous avez dû rencontrer ce problème également, vous avez un tableau qui contient des données chiffrées et les nombres ne s'alignent pas forcément correctement verticalement à cause de la taille variable des lettres de votre police d'écriture.

Il existe une règle CSS pour y remédier si la police le supporte.

Tester ses couleurs pour l'accessibilité c'est pas si compliqué

Deux outils sont apparus sur mon radar à quelques jours d'intervalle :

  • ColorCube permet de confronter la liste des couleurs de votre projet aux principaux contrastes et de les ajuster individuellement pour passer les paliers d'accessibilité ;
  • Who Can Use est pratique pour donner un peu plus de réalisme aux problématiques liées aux contrastes des couleur en indiquant avec de nombreux exemples les pathologies concernées.