Brackets - Code-Editor für alle Betriebssysteme

Brackets ist ein freier Code-Editor auf Basis von Open Source. Und noch viel wichtiger – Brackets ist für alle wichtigen Betriebssysteme verfügbar und läuft schnell und stabil!

Was nach dem Start von Brackets auffällt, ist die aufgeräumte Oberfläche. Keine unnötigen verwirrenden Symbole oder überladene Menüs. Der Editor Brackets macht genau das, was man sich als Webentwickler wünscht – man kann Code schnell und effektiv schreiben und wird vom Editor unterstützt.

Sein Fokus ist HTML, CSS und JavaScript. Allerdings gibt es zahlreiche Plug-Ins und so ist der Editor z.B. für PHP sehr gut geeignet (Plug-In „PHP SmartHints“ und „PHP Syntax Hint“).

Aber schauen wir uns den Editor erst unter dem Gesichtspunkt der Entwicklung von HTML-Seiten an.

Hier punktet er in Übersichtlichkeit und cleveren Ideen.

• Quellcode farbig darstellen („color highlighting“)
• Live-Vorschau (über den Browser Chrome)
• Geteilte Ansichten (horizontal und vertikal möglich)
• Schnelleditiermöglichkeiten von CSS
• Gute Shortcut-Unterstützung

Quellcode farbig darstellen

Ein sauberes „color highlighting“ für hellen und dunklen Hintergrund ist integriert (Menü Ansicht -> Design-Einstellungen). Hier mit ansprechenden Farben und einer guten Übersicht.

Live-Vorschau

Ist der Browser Google Chrome im System installiert, kann eine Live-Vorschau aktiviert werden. Jetzt ist jede Änderung im HTML-Code wie auch bei den CSS-Anweisungen sofort sichtbar. Der Button ist in der rechten Leiste ganz oben.

Geteilte Ansichten

Es können 2 Dateien nebeneinander angezeigt und bearbeitet werden. So ist die Bearbeitung der HTML-Datei und der zugehörigen CSS-Datei komfortabel möglich. Dies ist eigentlich durch die Schnelleditiermöglichkeit fast nicht notwendig – aber geschickt.

Schnelleditiermöglichkeiten von CSS

Im HTML-Code kann man auf IDs und Klassen gehen und per Shortcut oder mit der rechten Maustaste die Option „schnell bearbeiten“ auswählen. Jetzt wird der dazugehörige CSS-Code angezeigt und kann bearbeitet werden. Die Änderungen im CSS-Code werden in den entsprechenden CSS-Dateien automatisch abgespeichert. Tolle Möglichkeit, um auch zu sehen, welche CSS-Anweisungen gerade alle auf das ausgewählte Element wirken.

Shortcuts, die Zeit sparen

Zig Shortcuts (dieser Teil wird noch ausgebaut)

Command + d Zeile duplizieren

Shift + Space Auswahl an möglichen Anweisungen zum Code

Permanente Weiterentwicklung:

Brackets hat sehr kurze Zyklen, in dem der Code-Editor weiterentwickelt und dann aktualisiert wird. Zusätzlich können sich alle an der Weiterentwicklung von Erweiterungen (Plug-Ins) beteiligen.

Nachteil bei Brackets:

Die Live-Vorschau gibt es nur bei installiertem Browser Chrome von Google. Dies kann ein Nachteil sein, wenn man diesen Browser nicht verwenden möchte. Als Entwickler sollte man allerdings eh alle Browser zum Testen der Ergebnisse installiert haben.

Es wird nur UTF8 als Format unterstützt, was eigentlich kein Nachteil für Dateien für das WWW ist, höchstens man muss mit noch alten Dateien arbeiten, die in einem anderen Format gespeichert sind.

Download Brackets:

Download unter https://brackets.io