Mit Visual Studio Code bietet Microsoft seit geraumer Zeit kostenlos einen Editor an,
der sich eine große Fangemeinde erobert hat. Das liegt an dessen Vielseitigkeit und der Plattformunabhängigkeit. Wir stellen Visual Code genauer vor.

Traditionell reagieren viele Linux-Anwender kritisch bis allergisch, wenn es um die Installation von Microsoft-Software auf ihren Systemen geht. Im Falle von Visual Studio Code darf die Zurückhaltung ruhig abgelegt werden. Zwar steht der Editor unter einer speziellen Lizenz, der Quellcode ist allerdings unter https://github.com/microsoft/vscode einsehbar. Zu den wesentlichen Vorzügen des Programms zählt das plattformübergreifende Angebot. Visual Studio Code ist in Versionen für Linux, Mac und Windows verfügbar und wird auf allen drei Plattformen permanent weiterentwickelt. Und Microsoft hat dem Editor eine Menge Extras eingebaut, die ihn in ein flexibles Werkzeug verwandeln. Ob klassische Programmentwicklung, Arbeiten an Konfigurationsdateien oder sogar als kostenloses Schreibprogramm – fast alles ist möglich. So wundert es dann auch nicht, dass der Editor bei der letzten Umfrage des Portals Stack Overflow deutlich vor allen anderen Konkurrenten liegt.

Installation und erste Einrichtung

Der Editor steht für alle Plattformen auf der Projektseite unter https://code.visualstudio.com zur Verfügung. Für Linux-Anwender bietet Microsoft Binärpakete im DEB- und RPM-Format an. Zudem haben Sie die Wahl zwischen Paketen für 64-Bit-x86- und ARM-Architekturen. Sofern Sie das Snap-Containerformat für das Paketmanagement nutzen, gelangen Sie mit einem Klick in den Snap Store, um den Editor auch auf diesem Weg zu installieren.

Die Installation gelingt auf allen Wegen mühelos. Nach dem Programmstart begrüßt Sie ein Assistent, der innerhalb des Programmfensters abläuft. Die Auswahl, die Sie in den nächsten Schritten vornehmen, können Sie jederzeit zu einem späteren Zeitpunkt wieder ändern. Sie entscheiden sich zunächst für ein grundlegendes Farbschema. Dabei haben Sie die Wahl zwischen einem hellen und dunklen Theme sowie einer Darstellung mit besonders hohen Kontrasten.

Im unmittelbar darunter folgenden Dialog können Sie die Synchronisation von Einstellungen aktivieren. Wenn Sie vorhaben, an den gleichen Script- oder Programmierprojekten mit Visual Studio Code auf unterschiedlichen Geräten zu arbeiten, ist das eine sehr praktische Funktion. Denn die kümmert sich dann etwa darum, dass alle Anpassungen, die Sie an einem Editor vornehmen (Tastenkürzel, Erweiterungen und so weiter) auch an die anderen Instanzen übertragen werden. Dabei haben Sie die Wahl zwischen einer Synchronisation über die Microsoft-Cloud mit einem Microsoft-Konto oder über Github. Sobald Sie das Kommando aktivieren, wird am oberen Rand des Programmfensters eine kleine Eingabezeile sichtbar, die Ihnen die beiden Optionen darstellt. Nach der Auswahl öffnet sich der Browser des Systems, über den Sie sich dann bei Github oder Microsoft anmelden. Folgen Sie einfach den Anweisungen auf dem Bildschirm, um diesen Punkt abzuschließen.

Der Bereich „Tastenkombinationen“ beschäftigt uns gleich noch. Zu den Komfortfunktionen jedes Editors gehört die Hervorhebung der Syntax verwendeter Sprachen. VS Code ist hier von Haus aus gut ausgestattet. Nach Auswahl des Eintrags zeigt Ihnen die App die eingebaute Unterstützung. Sofern Ihnen hier etwas fehlt, können Sie es nachrüsten. Auf die Installation solcher Erweiterungen kommen wir aber ebenfalls in einem weiteren Abschnitt zurück.

Powertool: Befehlspalette

Eines der wichtigsten Werkzeuge in VS Code ist die Befehlspalette, die Sie stets mit Strg-Umschalt-P erreichen. Die Befehlspalette vereint eine ganze Reihe von Funktionen unter einer Oberfläche. Zum einen rufen Sie damit Kommandos des Editors oder von Erweiterungen auf. Auch wer im Laufe der Zeit viele Befehle des Programms oder von Add-ons mit einem Tastenkürzel ausführt, dürfte froh sein, dass die Befehle mit der Palette einfach gefunden werden können. Es genügt, wenn Sie etwa die Anfangsbuchstaben einer Funktion oder einer Erweiterung eintragen. In der Trefferliste erscheinen dann die verfügbaren Kommandos. Den gesuchten Befehl suchen Sie mit den Pfeiltasten aus und bestätigen mit der Eingabetaste. Eng verwandt mit der Befehls­palette ist die Funktion „Quick Open“. Mit Strg-P öffnen Sie dieses Eingabefenster. Tragen Sie dort etwas ein, dann sucht VS Code innerhalb seiner Arbeitsumgebung nach den passenden Dateien.

Programmfenster kennenlernen

Das Anwendungsfenster von VS Code gliedert sich nach dem Start in drei Bereiche. Ganz links befindet sich die „Aktivitätsleiste“ mit ihren Icons. Damit erreichen Sie eine Reihe von übergeordneten Funktionen, wie die Navigation in den Dateien, das eigene Profil oder die Einstellungen. Ebenfalls nach dem Start sichtbar ist der „Explorer“, der mit einem Klick auf die Dokumentensymbole in der Aktivitätsleiste ein- und ausgeblendet werden kann. Im Explorer wechseln Sie zwischen Ordnern und Dateien. Im Zentrum befindet sich der eigentliche Editor, dessen Ansicht bei Bedarf auch geteilt werden kann. Schließlich finden Sie am unteren Rand noch eine Statusleiste, deren Symbole Sie auf Codefehler hinweisen, aber auch die Position der Schreibmarke anzeigen.

Arbeitsordner oder Repository anlegen

Sie können jederzeit eine Datei anlegen oder öffnen, um diese zu bearbeiten. Die Entwickler gehen allerdings von einer konkreten Arbeitssituation aus, bei der verschiedene Dateien zu einem Projekt gehören. Sobald Sie mit „Ordner öffnen“ zu einem Verzeichnis Ihres Systems wechseln, schließt VS Code die aktuelle Instanz des Editors. Zudem erfolgt eine Sicherheitsabfrage, ob Sie den Autoren des Ordners vertrauen. Dies ist eine Vorsichtsmaßnahme, falls Sie Verzeichnisse auf Webservern öffnen. Es soll verhindert werden, dass Sie auf diesem Weg schadhaften Code in Ihre Projekte integrieren. Ein Arbeitsordner oder Verzeichnis kann ein Coding-Projekt sein oder der Ordner, in dem Sie etwa Blogbeiträge ablegen. Benötigen Sie für ein Projekt weitere Verzeichnisse, fügen Sie bei Bedarf einfach weitere Ordner hinzu – entweder per Kontextmenü mit „Ordner zum Arbeitsbereich hinzufügen“ oder durch Ziehen eines Ordners aus dem Dateimanager in die Leiste. Einmal im Arbeitsbereich vorhanden, können Sie über den Explorer jederzeit Unterordner und weitere Dateien direkt anlegen. Wenn Sie mit VS Code in erster Linie Software entwickeln, steht Ihnen über die Aktivitätsleiste auch der Zugriff auf die Quellcodeverwaltung zur Verfügung. Dazu im weiteren Verlauf noch etwas mehr.

Viel Schreibkomfort für alle

Für die tägliche Arbeit bringt VS Code eine Reihe von Funktionen mit, die das Schreiben angenehmer und schneller machen, egal ob damit Quellcode oder Fachartikel entstehen sollen. Dazu gehört das Syntax-Highlighting, das auf der Dateiendung oder Auswahl des Formats mittels der Statusleiste basiert. Tipparbeit wird durch das automatische Schließen von Klammern gespart und mit der Tastenkombination Strg-Leertaste rufen Sie Vorschläge zur Komplettierung von Code ab.

Neben der Dateisuche über die Suchleiste gibt es ausgefeilte Suchfunktionen, die etwa über das Lupensymbol aus der Aktivitätsleiste aufgerufen werden können. Bei einem Profiwerkzeug versteht sich fast von allein, dass in der Suche auch reguläre Ausdrücke verwendet werden dürfen. Und mittels weiterer Optionen, die über die drei Punkte in der Suchmaske erreicht werden, können Sie gezielt Dateien in einem Projekt respektive Arbeitsordner ein- oder ausschließen.

Ebenfalls praktisch ist die Funktion Multi-Cursor, mit der Sie per Tastenkürzel (Alt-Mausklick) mehrere Schreibmarken innerhalb einer Datei platzieren, um simultan Änderungen an unterschiedlichen Positionen vorzunehmen. Wem das noch nicht genügt, findet in den Erweiterungen zahlreiche Add-ons, die Spezialaufgaben bei der Codebearbeitung übernehmen. Ebenfalls nicht nur für Programmierer interessant ist die direkte Integration eines Terminals, ohne die Editorumgebung verlassen zu müssen. Code lässt sich dann darin direkt ausführen, um ihn zu überprüfen. Wer statt der Bash eine andere Shell nutzen will, kann das in den Einstellungen des Programms hinterlegen.

Quellcodeverwaltung direkt im Editor

VS Code besitzt nativ eine Verbindung für die Quellcodeverwaltung mit Git. Andere Versionskontrollsysteme wie SVN lassen sich mittels Erweiterungen nachrüsten. Für die Arbeit mit Repositorys stellt der Editor in der Aktivitätenleiste einen eigenen Bereich zur Verfügung. Sofern Git noch nicht auf dem Rechner installiert ist, holen Sie dies mit dem Paketmanager nach. Öffnen Sie dann in VS Code ein Terminal (Sie können selbstverständlich auch ein externes benutzen), wechseln Sie in einen Ordner, der als Repository dienen soll, oder legen Sie einen solchen Ordner an (Beispiel):

mkdir git_test

Wechseln Sie dann in die Quellcodeverwaltung, die Sie über das Symbol aus der Aktivitätsleiste erreichen, das an eine Weggabelung erinnert. Dort entscheiden Sie sich zunächst für „Open Folder“ und nutzen den gerade angelegten Ordner. Jetzt führen Sie das Kommando „Repository initialisieren“ aus, um die notwendige Struktur anzulegen. Sobald Sie ein Repository angelegt haben, markiert VS Code direkt in einer Datei Änderungen während der Eingabe. Über die Versionsverwaltung können Sie per Doppelklick auf eine bearbeitete Datei auch eine „Diff“-Ansicht aktivieren (Codevergleich). So werden Änderungen direkt erkennbar und lassen sich einfacher nachverfolgen.

Problemlos ist auch die Arbeit mit externen Repositorien möglich, dazu braucht es nur die URL. Bei einem geschützten Repository werden dann noch Benutzernamen und Passwort benötigt. Alle für die Remotearbeit erforderlichen Kommandos wie Pull, Sync oder Stash sind verfügbar und können direkt in der Umgebung verwendet werden.

Extrem anpassungsfähig

Ein Blick in die Einstellungen zeigt, dass sich dieses Werkzeug an die Wünsche und Bedürfnisse der Benutzer anpassen kann. Was die UI allerdings nicht verrät, ist die Ablage aller Optionen in einer JSON-Datei. Über die Befehlszeile können Sie diese mit „Open Settings“ am schnellsten auf den Bildschirm rufen. Einer der großen Vorzüge liegt hier darin, dass Sie die Arbeit mit dem Editor an Dateiformate anpassen können. Ein Beispiel sind hier meine eigenen Optionen für den Umgang mit Markdown-Dateien, in denen ich einen bestimmten Font, seine Größe, das verwendete Theme und die Darstellung von Lineal oder die Nutzung des Zeilenumbruchs nach Wunsch verändert habe.

{

....

"[markdown]": {

"zenMode.centerLayout": true,

"editor.fontFamily": "iA Writer Duospace, monospace",

"editor.wordWrap": true,

"editor.lineNumbers": "off",

"workbench.colorTheme": "Default Light+",

"editor.rulers": [],

"editor.fontSize": 14,

"editor.lineHeight": 25,

"editor.quickSuggestions": false,

},

...

}

Zudem lassen sich auch alle Tastenkombinationen nach Wunsch anpassen.

Noch mehr Optionen mit Erweiterungen

Rund um VS Code hat sich ein kaum überschaubares Angebot an Erweiterungen etabliert, die den Editor funktional ausbauen. Den Marketplace für VS Code erreichen Sie entweder direkt online oder Sie klicken auf das Zahnrad in der Aktionsleiste und wählen „Erweiterungen“. Im Angebot sind Programme für jeden Einsatzzweck, unter anderem ein Add-on für alle, die ihre Diplom- oder Studienarbeiten schreiben wollen. Der „Citation Picker“ for Zotero kümmert sich dann um das Einfügen von Quellen.

Wer reguläre Texte damit schreiben will, sollte sich die Add-ons zur Integration von „LanguageTool“ ansehen, die dann auch auf lokale Instanzen zugreifen können. Dabei lässt sich die Rechtschreibprüfung in reinen Quellcodedatei abschalten. Der „Bracket Pair Colorizer“ ist ein Beispiel für eine kleine Erweiterung, die die tägliche Arbeit erleichtert, wenn es um verschachtelten Code geht. Zusammengehörige Klammerpaare werden damit farbig hervorgehoben.

Ein echter Zeitsparer sind Erweiterungen, die den Einsatz von Snippets ermöglichen. Hier gibt es für fast jede Sprache ein korrespondierendes Werkzeug. Mit „HTML Snippets“ genügt dann etwa die Eingabe von „div“, um das Elementepaar zu erzeugen. Für Softwareentwickler, die Git verwenden, lohnt sich der Blick auf „Git Lens“, gerade bei Projekten, an denen viele Personen beteiligt sind. Visuell schauen Sie sich damit an, wer wann in welcher Datei welchen Code verändert hat.

„Markdown All in One“ oder der „Markdown Fiction Writer“ wiederum sind Beispiele für Erweiterungen, die den Editor funktional zu einer völlig anderen Anwendung machen. Denn diese Erweiterungen stellen nicht nur weitere Möglichkeiten im Umgang mit der Auszeichnungssprache Markdown zur Verfügung, sondern kümmern sich auch um die Projektverwaltung. So lassen sich ganze Buchmanuskripte mit VS Code schreiben.

Fazit

Mit Visual Studio Code hat Microsoft eine bemerkenswerte Software vorgelegt. Wanderer zwischen den Betriebssystemen Linux, Mac und Windows profitieren von einer konsistenten Bedienung auf allen Plattformen. Viele durchdachte Funktionen, Anpassungsfähigkeit und Erweiterbarkeit sowie die permanente Weiterentwicklung sprechen für sich. Solange es nicht um das direkte Bearbeiten von Dateien ohne grafische Oberfläche geht, bietet das Werkzeug wirklich alles, was zum Coden und Schreiben benötigt wird.

In meinem persönlichen Fall ist VS Code aus dem Alltag meines Redaktionsbüros nicht mehr wegzudenken. Sämtliche Texte, so auch dieser, entstehen mit diesem Editor, dabei ist natürlich praktisch, dass für Script-Beispiele und Listings nicht noch ein weiteres Programm gestartet werden muss. Mittels Markdown und Pandoc erhalten die Kunden ihre Texte in dem Format, das sie sich wünschen.