Grand Hotel Web 2.0

All die schönen Sachen

Wie aber hilft Ihnen diese flexible Oberfläche beim Programmieren? Mit zahlreichen Features wie Code-Assist, Outline, Codeergänzung, Syntax-Highlighting und durch die Integration bekannter Javascript-Bibliotheken. Wie bei anderen IDEs versammeln Sie Ihre Dateien in einem Projekt, das Aptana im Ordner Workspace ablegt. Diese Projekte exportieren und importieren Sie auf Wunsch.

Gerade bei der Arbeit an umfangreichen Webseiten erleichtern Projekte die Übersicht. Ein Klick auf File | New | Project öffnet ein neues Projekt. Sie entscheiden sich entweder für ein einfaches Projekt (Simple Project) oder ein AJAX Library Project, das Sie unter dem Eintrag Web Library Project finden. Sie geben dem Kind einen Namen und suchen dann heraus, welche Bibliotheken Sie für das AJAX-Projekt brauchen (Abbildung 5).

Aptana erzeugt nach dem Start eine Beispieldatei als Ausgangspunkt. Wählen Sie Dojo als Javascript-Bibliothek, heißt die Datei dojo_sample.htm. Sie erscheint links unten in der Projektansicht und im Quellcode auf der zentralen Arbeitsfläche. Links oben in Code Assist Profiles erscheinen die zugehörigen Javascript-Dateien dojo.js und html.js: Ein Doppelklick öffnet Sie zum Bearbeiten.

Nun schreiben Sie ein eigenes Programm: Code Assist – wie der Codeassistent auf englisch heißt – hilft Ihnen dabei. Löschen Sie zum Beispiel neben dem CSS-Selektor #fadeElm in der Datei dojo_sample.html die erste geschweifte Klammer und tippen sie neu ein, erscheint ein Kasten, der Ihnen nicht nur zeigt, welche CSS-Eigenschaften der Selektor verträgt, sondern auch, welche dieser Eigenschaften die bekannten Browser verstehen (Abbildung 5).

Jeder Browser interpretiert die CSS-Spezifikationen etwas anders, da hilft so eine Information weiter. Mit den Pfeiltasten navigieren Sie nun durch den Kasten. Markieren Sie ein Element, erscheint daneben ein so genannter Tooltipp, der erklärt, was das Element bewirkt. Über [Eingabe] bestätigen Sie Ihre Wahl, und Aptana fügt das Element neben dem Cursor ein.

Abbildung 5: Der Code-Assistent zeigt, welche Eigenschaften ein Selektor annehmen kann und in welchen Browsern er funktioniert.

Der Code-Assistent vervollständigt auf diese Weise einige Selektoren, Klassen und Funktionen – vorausgesetzt, er hat Informationen darüber. Mit Ihren selbst geschriebenen Funktionen weiss er zunächst nichts anzufangen. Also füttern Sie ihn über Scriptdoc. Die Software bereitet die Daten aus den Javascript-Dokumenten im Workspace für den Codeassistenten auf. Dazu müssen Sie ihren Code lediglich nach einem festen Schema dokumentieren.

Für besseren Durchblick in langen Codepassagen sorgt die Outline-Ansicht. Gewöhnlich sind die Tags und Funktionen im Quellcode hierarchisch angeordnet. Outline erkennt diese Elemente und ihre Beziehungen zueinander und bildet sie ab (Abbildung 6). Klicken Sie auf ein bestimmtes Element, springt der Cursor im Quellcode dorthin. Kleine Symbole neben den Tags verraten zudem, ob es sich um Funktionen, Variablen oder Selektoren handelt. Ein Klick auf ein Tag zeigt, welche Variablen und Funktionen sich darin verbergen. Outline dient aber nur der Navigation; mit dieser Ansicht verändern Sie die Einträge nicht.

Abbildung 6: Outline verschafft Ihnen einen Überblick über die Struktur eines Dokuments, indem es seine Elemente hierarchisch gruppiert.

Ein weiteres Aptana-Feature, das Ihnen den Umgang mit dem Code erleichtert, ist das Syntax-Highlighting. Die IDE hebt die verschiedenen Elemente im Programm farbig hervor, je nachdem, ob es sich um einen Wert, einen Kommentar oder schlicht um Text handelt. Das erleichtert den Überblick. Sie ändern die Farben – abhängig vom Dateityp – über Window | Preferences | Aptana | Editors.

Damit Sie Teile des Codes, die Sie oft brauchen, schnell zur Hand haben, gibt es die Snippets, zu deutsch: Codeschnipsel. Die finden Sie in der Aktionsansicht. Sie markieren ein Stück Text im Code und klicken dann auf den Schnipsel Ihrer Wahl: Um die Auswahl herum erscheint ein spezifischer Tag. Einige HTML-Templates bringt die Software bereits mit, eigentlich dient das Feature aber dazu, selbst solche Snippets anzulegen.

In Aptana vergleichen Sie auch zwei Dokumente miteinander oder die aktuelle mit einer früheren Version. Klicken Sie dazu mit der rechten Maustaste in den Quellcode und benutzen Sie die Option Compare with | Each Other. An der selben Stelle finden Sie auch den Eintrag Team | Apply Patch, über ihn spielen Sie einen Patch ein. Wie das Wort Team zeigt, erlaubt es die Software, dass Sie ein Projekt auf einem Netzlaufwerk ablegen und so anderen den Zugriff ermöglichen.

Über Plugins erweitern Sie die IDE: Die bereits vorhandene Unterstützung für Ruby on Rails nennt sich RadRails. Für die Zukunft planen die Entwickler von Aptana aber auch Plugins für PHP und ASP.

Einstellungssache

Natürlich erlaubt es Aptana, eine Reihe von Dingen selbst einzustellen: Der Menüpunkt Window | Preferences zaubert einige Reiter hervor, die ein Feintuning erlauben. Unter Appearance passen Sie die Farben und Ansichten von Aptana an. Im Bereich Editors heißt ein wichtiger Abschnitt Keys: Dort legen Sie Tastaturkürzel für Aptana fest, um schneller an wichtige Funktionen zu gelangen.

An anderer Stelle weisen Sie den Editoren Dateiformate zu: Fehlt zum Beispiel ein Editor für XUL-Dateien, ordnen Sie diese dem XML-Editor zu. Unter Startup and Shutdown bestimmen Sie, welche Plugins die IDE automatisch lädt, wenn sie startet. Im Bereich Workspace legen Sie fest, wie oft die Software Ihre Daten zwischenspeichert und wie viele Schritte Sie in einem Dokument rückgängig machen wollen.