www.gerits-aurelien.be

Dev front

Tutoriel MagixMaps : Maîtriser Google Maps en Vanilla JS

Cet article présente MagixMaps, une bibliothèque JavaScript qui simplifie l'intégration de l'API Google Maps en gérant le chargement asynchrone, la sanitisation des données et l'automatisation du géocodage. Elle propose une interface robuste permettant de réduire la complexité des interactions avec Google Maps, avec des exemples pratiques d'utilisation et des conseils d'optimisation.

Dev front

Advreplace : Plugin de Nettoyage HTML Regex pour TinyMCE 6 & 7

Advreplace est un plugin Open Source pour TinyMCE qui permet de nettoyer le code HTML en utilisant des expressions régulières. Il offre des fonctionnalités avancées pour conserver un code propre et éviter l'injection de balises et styles indésirables. Avec un mode interne sans bibliothèques externes, ce plugin garantit un workflow optimisé pour les développeurs, améliorant ainsi la performance, le SEO, et l'accessibilité des contenus. Facile à intégrer et à utiliser, il représente un gain de temps considérable pour la maintenance de contenus web.

Dev front

Aligner un catalogue de produits avec CSS Subgrid

Cet article présente une méthode pour aligner harmonieusement un catalogue de produits en utilisant CSS Subgrid, permettant d’éviter un effet visuel désordonné lorsque les descriptions des produits varient en longueur. Il aborde la structure HTML sémantique et la création d'une grille parente pour assurer un alignement cohérent des éléments sur chaque carte produit, garantissant ainsi une apparence professionnelle.

Dev front

Guide Complet CSS Subgrid : Maîtriser l'alignement de grille avancé.

Cet article présente le CSS Subgrid, une technique révolutionnaire pour améliorer l'alignement des éléments dans une mise en page. Le Subgrid permet à un élément enfant d'adopter la grille de son parent, facilitant ainsi l'alignement dynamique et la maintenance du design. En utilisant le Subgrid, les concepteurs peuvent éviter les calculs complexes pour aligner divers éléments sur leurs pages web tout en assurant une performance optimale grâce à la rapidité d'interprétation du CSS par les navigateurs. Des exemples et une introduction au CSS Grid Layout sont également fournis.

Dev front

Vignettes carrées responsives avec CSS Grid et aspect-ratio

Cet article présente une méthode moderne pour créer une galerie de vignettes carrées et responsives à l'aide de CSS Grid, sans nécessiter de longues Media Queries. Il aborde la structure HTML simple, la mise en place de la grille avec une règle unique, et la solution pour centrer le contenu, garantissant ainsi une présentation impeccable sur toutes les tailles d'écran. Cette approche assure une mise en page adaptative, performante et facile à maintenir.

"
Dev front

Convertir HEX en HSL/HSLA : Les 2 méthodes LESS pour une gestion des couleurs flexible

Cet article présente deux méthodes pour convertir des couleurs HEX en HSL et HSLA avec LESS, facilitant la gestion des couleurs en CSS. La première méthode utilise des mixins pour appliquer directement le style, idéale pour des cas simples. La seconde méthode assure plus de flexibilité en retournant une valeur de couleur pouvant être assignée à différentes propriétés CSS, recommandée pour des projets complexes afin d'améliorer la maintenabilité.

"
Dev back

Le guide complet pour une lecture Excel PHP rapide (streaming vs toArray)

Cet article compare les méthodes d'importation de données à l'aide de PhpSpreadsheet et OpenSpout pour la lecture de fichiers Excel en PHP. Il met en avant OpenSpout comme la meilleure option pour l'importation massive grâce à sa gestion en streaming qui optimise la mémoire, tout en détaillant les avantages et inconvénients des deux bibliothèques. OpenSpout est recommandé pour de grandes tailles de fichiers, tandis que PhpSpreadsheet est plus adapté pour des manipulations avancées.

Dev front

Convertir HEX en RGBA avec un mixin LESS pour la transparence

Ce tutoriel explique comment convertir des codes hexadécimaux en format RGBA à l'aide d'un mixin LESS. Le mixin accepte un code couleur hexadécimal et une valeur d'opacité, facilitant la gestion des couleurs dans les projets. Il est intégré par défaut dans Magix CMS 3.7.8, mais peut également être utilisé dans d'autres projets. La compatibilité avec les formats courts est également mentionnée.

Dev front

Les sélecteurs CSS :is, :not, :where et :has : Explications et exemples par la pratique.

Cet article présente les sélecteurs CSS modernes tels que :is, :not, :where et :has, en expliquant leur importance pour cibler des éléments de manière efficace. Il aborde comment ces nouveaux sélecteurs simplifient le code en permettant de définir des règles communes et d'exclure certains éléments. Des exemples pratiques illustrent leur utilisation, mettant en avant la lisibilité et la maintenance du code en CSS.

Dev front

Tuto CSS : Contour de Texte avec text-stroke & text-shadow

Cet article présente un tutoriel sur la création de contours de texte en CSS. Il explore deux méthodes principales : l'utilisation de la propriété text-stroke pour ajouter directement des contours aux textes, et l'utilisation de text-shadow, qui permet de simuler un contour sans les problèmes de compatibilité. Des recommandations de polices Google Fonts adaptées pour ces techniques sont également fournies, ainsi que des exemples de code.