Introduction
L'auteur de cet article a récemment migré certains de ses sites web de Tailwind vers du HTML sémantique et du CSS vanilla. Cette expérience a été enrichissante et a permis à l'auteur de découvrir de nouvelles façons de structurer son code CSS.
Contexte Technique
L'auteur a commencé par utiliser Tailwind il y a 8 ans, car il ne savait pas comment structurer son code CSS. Cependant, après avoir lu des articles sur la façon de structurer le CSS, il a réalisé que chaque base de code CSS avait différents éléments tels que les dispositions, les polices, les couleurs et les composants communs. Il a également compris que des systèmes ou des directives étaient nécessaires pour gérer ces éléments et éviter le chaos.
Il a décidé de copier certains systèmes de Tailwind, tels que la feuille de style de réinitialisation, la palette de couleurs et la mise à l'échelle des polices. Il a également créé des règles pour son codebase, notamment pour les composants, les couleurs, les tailles de police et les classes utilitaires.
Analyse et Implications
L'auteur a constaté que la migration de Tailwind vers du CSS vanilla a été bénéfique pour son apprentissage et sa compréhension du code CSS. Il a pu créer des composants plus modulaires et réutilisables, et a amélioré la lisibilité et la maintenabilité de son code.
Cependant, il a également rencontré des défis, tels que la gestion des espaces et des marges, et la création de dispositions réactives. Il a dû apprendre à utiliser de nouvelles fonctionnalités CSS, telles que les grilles, pour créer des dispositions plus flexibles et réactives.
Perspective
L'auteur est conscient que son apprentissage est en cours et qu'il y a encore beaucoup à découvrir sur le CSS. Il est impatient de continuer à apprendre et à améliorer ses compétences en matière de structuration du code CSS.
Il conseille aux développeurs de prendre le temps de comprendre les bases du CSS et de créer des systèmes et des directives pour gérer leur code. Il est également important de rester à jour avec les dernières fonctionnalités et les meilleures pratiques en matière de CSS.
