Tools für LESS

Written by | 01 May 2013 | Published in 2013 May
Im Sinn eines Follow-up zu David Hurley’s Übersicht zu LESS bzw. weniger Arbeit dank LESS, folgt hier eine Zusammenstellung von Programmen und Werkzeugen, die das Arbeiten und Coden der Webseiten mit LESS weiter vereinfachen sollen. Speziell für all diejenigen, die aus der CSS Welt kommen, und sich nun mit LESS auseinandersetzen müssen. Dieser Beitrag stellt einige Tools vor, denen unsere Praktikanten in unserer Firma (PB Web Development) bei ihrer Arbeit und beim Lernen von LESS und Joomla! begegnet sind.  

Code Highlighter

Zuerst einmal gibt es die Möglichkeit, einen Editor mit Code Highlighting zu verwenden. Sehr beliebt ist nach wie vor Adobe's Dreamweaver. Zwar ein Relikt aus der Vergangenheit und abschreckend für Programmierer, aber für den Neuling oder jemand mit einem Design-Hintergrund durchaus geeignet - bevor man sich für einen robusteren Coder Editor entscheidet, wie etwa Eclipse, NetBeans oder PHPStorm.

Dreamweaver hat einen guten CSS Code Highlighter eingebaut, auch einen brauchbaren Code-Ergänzer, aber für die Arbeit mit LESS funktioniert das nicht auf Anhieb.

Was hier zusätzlich benötigt wird, ist eine Erweiterung für Dreamweaver, die die LESS Elemente kennt. Die Adobe Webseite bietet dafür die Extension LESS code highlighting an.

Ein anderer sehr beliebter grafischer Code Editor für Macs ist Coda 2 und dafür gibt's ein hübsches LESS code syntax highlighter Modul als Zusatz.

Das nächste Tool das wir brauchen ist ein Kompiler für unser LESS. Ältere Browser können mit LESS nichts anfangen und können folglich alles was nach LESS aussieht (Funktionen, Mixins etc.) nicht rendern.

LESS Kompiler

Hat man seinen LESS Code fertig geschrieben, steht man vor dem Problem, dass er nicht getestet werden kann, bevor er kompiliert als CSS vorliegt. Einige Joomla! Template Frameworks haben einen eingebauten LESS Kompiler - das vereinfacht dynamische Testen. Testen auf der lokalen Maschine oder in einer Entwicklungsumgebung ist allerdings etwas schwieriger.

Hier kann ein Stand-alone LESS Kompiler weiterhelfen.

CrunchApp

CrunchApp ist eine einfache und schnelle Applikation, welche nicht nur LESS kompilieren kann, sondern auch beim Aufspüren von Syntaxfehlern hilft. Nichts ist ärgerlicher, als in einer LESS Datei nach einer fehlenden Klammer zu suchen.

SimpleLess

Das SimpleLess Tool funktioniert sowohl unter Windows, als auch auf dem MAC und erlaubt durch Drag & Drop das Kompilieren von LESS Dateien. Die App überwacht Änderungen an Dateien und re-kompiliert sie, sodass Testen nach jeder Änderung gleich möglich ist. Dieser Automatismus erspart einem den zusätzlichen Schritt, den Kompiler nach jeder Änderung erneut anwerfen zu müssen.

Dreamweaver LESS Kompiler

Der Dreamweaver LESS Kompiler ist nicht der beste und er funktioniert auch nicht in jeder Situation. Wir hatten damit nicht viel Glück, aber wenn jemand gute Erfahrungen damit gemacht hat, würden wir uns freuen, darüber zu erfahren.

WinLess

Für den Windows Entwickler gibt es mit WinLESS ein grossartiges Tool, um automatisch alle LESS Dateien in einem Verzeichnis zu CSS zu kompilieren. Die Software überwacht das Verzeichnis, alle Änderungen werden sofort kompiliert. 

Online Win Kompiler

Für den gelegentlichen Gebrauch kann man ein schnelles Testen diesen  online LESS compiler von WinLess gebrauchen. Ein schneller und einfacher Kompiler, der auch Fehler hervorheben kann.

Highlighter und Compiler Suites

Schliesslich - am anderen Ende der Möglichkeiten - für den eher versierten Entwickler, der sich nicht von einer Code-spezifischen Entwicklungsumgebung abschrecken lässt - steht PHPStorm. Dafür gibt es LESS Highlighters, Kompilers und viele andere Zusätze, alle arbeiten innerhalb vonPHPStorm. Allerdings kostet der Editor Geld.

An der Open Source Front gibt es ebenfalls beliebte Alternativen, die ähnlich mächtig sind bezüglich Highlighting und Kompiler:

Für NetBeans, einen sehr beliebter Editorgibt es ein LESS addon welches in den Editor installiert werden kann.

Für Eclipse, einen anderen beliebten Editor gibt es ein ebenfalls sowohl LESS highlighting und Kompiler.

So gibt es für praktisch jeden Geschmack an Editoren etwas brauchbares zum Arbeiten und Coden mit LESS.

Immer noch am Erlernen von Less?

Das geht schon in Ordnung, und es ist auf jeden Fall eine gute Idee, sich jetzt mit LESS zu beschäftigen. Viele Entwickler von Templates bewegen sich ebenfalls in dieselbe Richtung. LESS lernen und damit den Entwicklungs- und Implementierungsprozess beschleunigen wird für den Bau von Webseiten immer wichtiger.

Am Besten beginnt man bei http://lesscss.org/, um die grundlegenden Konzepte von LESS näher kennen zu lernen.

 

Dieser Artikel stammt ursprünglich aus der Feder von Peter Bui und erschien im Joomla! Community Magazine May 2013

Read 7457 times Tagged under German
Chris Hoefliger

Chris Hoefliger

Chris got involved in Joomla a few years ago (when 1.5.14 was the flavour of the day). But he stayed with Joomla! ever since, is eager and wants to learn the ropes...
«I have a small company and do web pages. I speak both German and English. I'd like to see a bit more content here in my native language and - oops got caught. Yep, I'm trying to do a bit translation work for the team»