Pour faire suite à l'article de David Hurley sur l'utilisation de less, Utilisez LESS avec Joomla!, j'ai établi une liste d'outils et programmes que vous pouvez utiliser pour travailler et encoder plus facilement vos sites web avec LESS, surtout si vous venez de l'univers des CSS traditionnelles et que vous essayez de comprendre le fonctionnement de LESS. Cet article passe en revue un ensemble d'outils LESS utiles et découverts par nos stagiaires, chez PB Web Development, pendant leur travail et apprentissage de LESS et Joomla.

Editeurs de code avec coloration syntaxique

Le premier outil avec lequel travailler est un éditeur avec coloration syntaxique. L'outil le plus populaire pour le codage de site est de loin Dreamweaver. Une relique du passé mais pour un débutant ou une personne ayant une formation en design, cet outil est plutôt agréable pour progresser, avant de passer à un éditeur de code plus "robuste" tel que Eclipse, NetBeans ou PHPStorm.

Dreamweaver intègre un bon éditeur de code CSS avec coloration syntaxique et suggestion de code CSS, et il en est de même pour LESS et SASS dans sa dernière version.

Un autre éditeur de code populaire pour Mac est Coda 2 et il existe un sympathique module de code LESS avec coloration syntaxique que vous pouvez ajouter à l'éditeur.

L'outil suivant dont vous aurez besoin est un compilateur LESS. En effet, un ancien navigateur ne sera pas en mesure de reconnaître les fichiers LESS et ne pourra pas renvoyer un bon nombre de vos fonctions, mixins LESS et ainsi de suite.

Les compilateurs LESS

Une fois que vous avez écrit tout votre code LESS, vous ne pourrez pas le tester avant de l'avoir compilé en CSS. Certains frameworks de template Joomla! sont dotés d'un compilateur LESS intégré pour faciliter les tests dynamiquement à la volée, mais lors de tests en local ou sur un environnement de développement, cela peut s'avérer plus difficile.

C'est à ce moment-là qu'un compilateur LESS autonome peut aider au processus.

CrunchApp

CrunchApp est une application rapide et simple d'utilisation qui compile vos fichiers LESS et au cas où vous auriez fait des erreurs, il vous indique les lignes comportant ces erreurs syntaxiques. Il n'y a rien de pire que d'essayer de trouver une accolade en trop qui vient briser votre code LESS.

SimpleLess

L'outil SimpleLess fonctionne aussi bien sous Windows que sous Mac et permet de compiler vos fichiers LESS par un simple glisser / déposer. Il va vérifier les changements dans les fichiers et les recompiler à la volée. Ainsi, vous pouvez continuer de tester votre site pendant son codage. Cela permet de sauter cette étape supplémentaire et vous facilite la vie.

WinLess

Si vous êtes un développeur Windows, alors WinLESS est un excellent outil pour compiler automatiquement votre répertoire de fichiers LESS, sur lesquels vous travaillez, directement en CSS. Il surveille les modifications apportées aux fichiers LESS et les compile. 

Online Win Compiler

Dans les cas où vous avez besoin de tester et valider rapidement votre code LESS en cours, essayez d'utiliser ce compilateur online LESS compiler de WinLess. Il est doté d'un compilateur rapide et simple d'utilisation qui met en exergue vos erreurs.

Surligneurs et compilateurs complets

Si vous êtes un très bon codeur et que travailler sur une application de code spécifique ne vous effraye pas, essayez PHPStorm. Il est doté de surligneurs, compilateurs LESS et d'autres outils utilisables sur PHPStorm. Cet éditeur est payant.

Du côté open source, il existe d'autres alternatives, également très populaires et toutes aussi performantes que les autres surligneurs et compilateurs.

NetBeans, un éditeur très populaire, bénéficie d'un module complémentaire LESS que vous pouvez lui adjoindre.

Eclipse, un autre éditeur de texte populaire, est doté également d'un module de coloration syntaxique et d'un compilateur LESS.

Alors quel que soit votre penchant pour un éditeur ou un autre, il y en a forcément un que vous pouvez utiliser pour votre code.

Vous souhaitez en apprendre plus sur Less?

Eh bien, c'est très bien ! Un bon nombre de développeurs de template vont dans cette direction, et apprendre LESS pour vous aider à optimiser vos processus de développement et d'implantation est essentiel pour la mise en place d'un site web moderne.

Le meilleur endroit pour commencer à apprendre les concepts et idées de base est http://lesscss.org/