Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

t3n 22

Browser als Code-Editor: Online-Editoren und was sie leisten

Der Editor eines Webentwicklers entspricht dem Werkzeugkoffer eines Handwerkers: Neben persönlichen Vorlieben spielt vor allem die Ausstattung eine wichtige Rolle. Doch inzwischen prägen auch weitere Aspekte die Wahl des richtigen Code-Editors: Gibt es Lösungen in der Cloud? Und wie können mehrere Entwickler gleichzeitig an einem Projekt arbeiten? Ein Statusbericht.

Wenn es an die technische Umsetzung eines Webprojekts geht, stehen dem Entwickler etliche kostenlose Werkzeuge zur Verfügung. Texteditoren mit Syntaxhervorhebung sind in einer großen Zahl vertreten und bieten viele nützliche Funktionen, die das Bearbeiten von Quelltexten komfortabel machen. Je nach Projektumfang eignen sich neben einfachen Editoren wie Notepad++ oder TextMate auch komplette Entwicklungsumgebungen, etwa Aptana oder Eclipse, für die Arbeit mit Skriptsprachen. Doch während der Gedanke eines Online-Code-Editors vor einigen Jahren noch außer Frage stand, gibt es heute viele interessante Alternativen, Quelltexte direkt im Browser zu bearbeiten. Dennoch scheint der Bedarf an Editoren, die im Browser gestartet werden und keiner Installation bedürfen, gering zu sein.

Der Skywriter von Mozilla unterstützt verschiedene Sprachen und kann per Bookmarklet auf Textfelder einer Webseite angewendet werden.
Der Skywriter von Mozilla unterstützt verschiedene Sprachen und kann per Bookmarklet auf Textfelder einer Webseite angewendet werden.
Darüber hinaus steht der Skywriter als Bookmarklet, eine Art Applikation, die per Browser-Lesezeichen geladen wird, auf der Projektseite zur Verfügung [3]. Per JavaScript lädt das Lesezeichen den Skywriter-Code nach und wandelt so Textfelder beliebiger Webseiten in Editoren um.

Kommunikation durch Kollaboration

Ein weiterer Pluspunkt der Online-Code-Editoren ist die Möglichkeit der Kollaboration: Wird ein Projekt von unterschiedlichen Personen bearbeitet, bietet sich eine vernetzte Zusammenarbeit an. Doch nicht immer steht ein Server zur Versionsverwaltung (CVS, SVN, TFS etc.) zur Verfügung. An dieser Stelle springen viele Browser-Editoren in die Bresche und erstellen auf Knopfdruck beständige Links, die an die gewünschten Personen weitergeleitet werden. Diese permanenten Links verweisen auf die entsprechenden Code-Versionen. Geänderte Dateien erkennen die Editoren und erzeugen neue Links. Versionsverwaltung 2.0 sozusagen. Eine Kollaboration über den Browser bietet sich aber nicht nur für Entwicklerteams an, sondern eignet sich auch für Fehlerdiagnosen und Fernwartung.

Dynamische Browser-Editoren

Für die browsergestützte Entwicklung komplexer PHP-Anwendungen stehen auch komplette Entwicklungsumgebungen online zur Verfügung. Ein interessanter Kandidat ist PHPanywhere [4]. Nach der erforderlichen Registrierung präsentiert sich PHPanywhere als moderne Entwicklungsumgebung, die neben grundlegenden Editor-Funktionen auch Code-Folding und einen FTP-Explorer beinhaltet. Benutzer können mit der Online-IDE also direkt auf dem Server arbeiten und sind nicht an einen bestimmten Arbeitsplatz gebunden. PHPanywhere bietet neben Tabs auch die Möglichkeit, Schritte unbegrenzt rückgängig zu machen, wodurch auch ältere Änderungen wiederhergestellt werden können. Der einzige Wermutstropfen ist die fehlende Unterstützung von Internet Explorer und Safari; PHPanywhere setzt einen Webbrowser mit Gecko-Engine voraus.

Direkt loslegen kann der Benutzer auch beim Amy Editor [5]. Die einer Mac-Oberfläche nachempfundene Entwicklungsumgebung reagiert überraschend schnell und beherrscht neben der Syntaxhervorhebung von PHP, JavaScript, HTML und CSS auch Ruby, C, C++ und C#. Dateien organisiert Amy in Projekten, die entweder leer gestartet oder von bestehenden Quellen übernommen werden können. Als bestehende Quellen akzeptiert der Editor Dateien und Ordner von der eigenen Festplatte sowie Projekte auf anderen Servern, die er via FTP oder WebDav kontaktiert. Um Projekte verwalten zu können, ist aber eine Registrierung notwendig.

JS Bin erstellt Revisionen und bindet auf Knopfdruck bekannte JavaScript-Frameworks ein.

JS Bin erstellt Revisionen und bindet auf Knopfdruck bekannte JavaScript-Frameworks ein.

Das wohl vielversprechendste Projekt, das eine komplette Arbeitsumgebung für größere Projekte zur Verfügung stellt, ist Kodingen [6]. Hier finden sich neben komfortablen Bearbeitungsmöglichkeiten ebenfalls ein Dateibrowser und FTP-Zugriff. Außerdem stehen eine Datenbankverwaltung, ein Shell-Zugang, Teamfunktionen und die Möglichkeit zur Verfügung, Versionierungssysteme wie SVN oder Git einzubinden. Der Code-Editor selbst kann bei Kodingen frei gewählt werden: Zur Auswahl stehen etwa Mozillas Skywriter, CodeMirror [7] und Ymacs [8]. Das Kodingen-Projekt wird aktiv entwickelt und weist eine sehr große Community auf. Es ist somit der derzeit wohl aufwendigste Ansatz, komfortable Webentwicklung in das Browserfenster zu bringen.

Fazit

Online-Code-Editoren brauchen sich nicht mehr hinter ihren Desktop-Geschwistern zu verstecken. Ihre volle Stärke spielen sie aus, wenn es darum geht, Projekte gemeinsam oder von mehreren Arbeitsplätzen aus umzusetzen. Zudem eignen sich browserbasierte Werkzeuge besonders für das schnelle Experimentieren mit JavaScript- oder CSS-Bausteinen, da die Ausgabe direkt betrachtet werden kann. Der Idee, komplexe Projekte gänzlich im Internet zu entwickeln, tragen Projekte wie PHPanywhere, der Amy Editor oder Kodingen Rechnung.

Während der Großteil der beschriebenen Editoren für Webskriptsprachen ausgelegt ist, gibt es inzwischen auch Online-Editoren für klassische Software-Entwicklung. Hier stehen Compiler und Interpreter für Sprachen wie C++, Java, Haskell oder Lua bereit, welche die Code-Ausgabe im Browser darstellen. Dazu zählen etwa Projekte wie Ideone [9] und Codepad [10].

In der Praxis stellen Offline-Editoren in vielen Fällen dennoch die bessere Wahl dar, denn bestimmte Funktionen und Eigenschaften bleiben nach wie vor den nativen Anwendungen vorenthalten; etwa anpassbare Tastaturkürzel, reguläre Ausdrücke in Suchfunktionen und Dateivergleiche. Darüber hinaus sind lokal gewartete Projekte häufig bereits in einen Sicherungszyklus eingebunden, während online gewartete Projekte stets explizit lokal gesichert werden müssen, um möglichen Verlusten vorzubeugen. Im Übrigen beherrschen auch einige Desktop-Editoren Kollaborationsfunktionen. Mit Notepad++ etwa können mehrere Personen gleichzeitig an einer Datei arbeiten.

Bildnachweis für die Newsübersicht:  HARO Flooring - Parkett & Laminat / flickr.com, Lizenz: CC-BY-SA

Bitte beachte unsere Community-Richtlinien

Schreib den ersten Kommentar!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Finde einen Job, den du liebst