Quotidien Shaarli
November 3, 2025
L’article explore l’utilisation de la fonction trigonométrique tan() en CSS, souvent perçue comme la fonction la plus détestée selon le State of CSS 2025. L’auteur démontre son utilité, notamment pour manipuler des formes géométriques comme les triangles et les polygones. Après un rappel mathématique (tan = sin/cos = opposé/adjacent), il montre comment tan() permet de calculer dynamiquement la hauteur de triangles pour créer des polygones réguliers à partir de listes HTML, sans recourir à des valeurs fixes. L’exemple concret illustre la création d’un menu circulaire ou d’une galerie d’images polygonale, en combinant tan() avec clip-path et des rotations CSS. L’article souligne aussi les limites de tan() (valeurs indéfinies à 90° et 270°) et mentionne des cas d’usage inspirants comme des layouts diagonaux ou des puzzles tangram. Une lecture utile pour découvrir des applications pratiques et créatives des fonctions trigonométriques en design web.
dependency-cruiser est un outil open source qui permet de valider et visualiser les dépendances dans les projets JavaScript, TypeScript, CoffeeScript ou LiveScript. Il analyse les dépendances selon des règles personnalisables, détecte les violations (comme les dépendances circulaires ou manquantes), et génère des rapports sous forme de texte, graphiques (dot, mermaid, SVG), HTML ou CSV. Idéal pour intégrer dans un pipeline CI/CD, il s’installe via npm/yarn/pnpm et se configure facilement avec npx depcruise --init. Il offre aussi des visualisations claires pour mieux comprendre l’architecture de son code.
Cet article concerne l’importance des modèles de domaine typés en PHP, renforcés par des outils comme PHPStan et Psalm. L’auteur explique que la sécurité des types permet de préserver l’intégrité architecturale en rendant impossibles les états invalides (ex. : un montant négatif pour une classe Money). Les outils d’analyse statique détectent les violations de contrats, les fuites de nullabilité ou les dépendances architecturales non désirées, là où les tests unitaires peuvent échouer. L’article souligne que modéliser chaque concept métier (comme EmailAddress ou UserId) en tant que type dédié, et utiliser des règles personnalisées dans PHPStan/Psalm, transforme le code en un système fiable et auto-documenté. L’objectif : aligner l’intention des développeurs avec le comportement réel du code, réduisant ainsi la dette technique et les erreurs silencieuses. Une approche progressive est recommandée pour intégrer ces pratiques dans les projets existants.
Ce billet de CSS-Tricks explore comment exploiter la relation parent-enfant en CSS pour créer des animations efficaces et simplifiées. L’idée centrale est d’animer le conteneur parent plutôt que chaque enfant individuellement, ce qui réduit la complexité du code et améliore les performances.
L’exemple principal utilise un conteneur <main> contenant quatre cercles positionnés absolument. En appliquant une rotation et une réduction de largeur au parent, les cercles se déplacent et s’animent automatiquement, car leur position dépend de celle du parent. L’article montre aussi comment combiner des transformations (comme skew, rotate, scale) sur le parent et les enfants pour obtenir des effets visuels variés, comme des carrés qui s’échangent ou se séparent.
L’approche est particulièrement utile pour des animations simples et synchronisées, où les transformations du parent influencent directement le comportement des enfants. L’article propose également des variantes avec des éléments <details> pour déclencher les animations via des interactions utilisateur. Une astuce pratique pour des animations fluides et faciles à maintenir !