Welche VS Code Plugins ich verwende

Visual Studio Code ist eines der beliebtesten Code Editoren und das nicht ohne Grund. Es ist kostenlos, Open Source und hat eine große Community. Ich verwende VS Code seit einigen Jahren und habe in der Zeit einige Plugins entdeckt, die ich nicht mehr missen möchte. In diesem Artikel möchte ich euch meine Favoriten vorstellen.

Astro

Astro ist ein All-In-One Web Framework für Content orientierte Websites. Ich verwende es für meine Website und bin sehr zufrieden damit. Das Plugin bietet Syntax Highlighting, Snippets und vieles mehr. Ein Muss für Entwickler die Astro verwenden.

Download

Auto Rename Tag

Auto Rename Tag ist ein sehr nützliches Plugin, das es ermöglicht, Tags automatisch zu ändern. Wenn ich zum Beispiel ein <div> Tag zu einem <p> Tag ändere, wird das schließende Tag automatisch mit geändert.

Download

Comment Anchors

Comment Anchors ist ein Plugin, das es ermöglicht, Kommentare mit einem Link zu versehen. Wenn ich zum Beispiel einen Kommentar schreibe, kann ich diesen mit einem Link versehen, der mich direkt zum Kommentar führt. Alle Links werden in einem Panel gesammelt, das über die Sidebar erreichbar ist.

Download

Git Graph

Diese Erweiterung ermöglicht es, den Git Graphen direkt in VS Code anzuzeigen. Ich verwende es, um einen Überblick über meine Commits zu behalten und um zu sehen, welche Branches ich habe und wie diese verlaufen.

Download

GitHub Copilot

Copilot macht Vorschläge für Code, die auf künstlicher Intelligenz basieren. Ich verwende es, um mir Code Snippets zu generieren, die ich dann in meine Projekte einfügen kann. Es ist ein sehr nützliches Plugin, das mir viel Zeit spart. Gerade die Context bezogenen Vorschläge, die auf dem Code basieren, den ich gerade schreibe sind sehr zeitsparend.

Download

Inline HTML

Mit Inline HTML erhälst du Syntax Highlighting für HTML in JavaScript Dateien. Wenn du HTML Code mit JavaScript erzeugst oder einfach Templates in JavaScript verwendest, ist dieses kostenlose Plugin auf jeden Fall sein Geld wert 😁.

Download

Live Server

Die bekannteste VS Code Erweiterung würde ich vermuten. Es ermöglicht eine lokale Entwicklungsumgebung zu erstellen. Es ist sehr nützlich, wenn du eine Website entwickelst und diese lokal testen möchtest. Es ist sehr einfach zu bedienen und bietet viele nützliche Funktionen.

Download

Markdown All in One

Wenn du Markdown Dateien erstellst und bearbeitest dann ist diese Erweiterung Pflicht. Es bietet viele nützliche Funktionen wie zum Beispiel das automatische Erstellen von Überschriften, das automatische Erstellen von Links, TOC und vieles mehr.

Download

Marp for VS Code

Marp ist ein Markdown Präsentationsframework. Präsentationen mit Markdown zu erstellen, wenn das dein Traum ist, dann bist du hiermit bestens bedient. Mit wenigen Handgriffen kannst du bereits exisierende Markdown Dateien zu einer Präsentation machen. Das beste Feature ist der Export mit dem du eine HTML Präsentation erstellen kannst.

Download

Material Icon Theme

Material Icon Theme ist ein Icon Theme für VS Code. Es bietet viele Icons für verschiedene Dateitypen und Verzeichnisse. Es ist sehr nützlich, wenn du viele verschiedene Dateitypen in deinem Projekt hast und diese schnell unterscheiden möchtest.

Download

Mayukai Theme

Mayukai Theme ist ein Theme für VS Code. Es ist ein sehr schönes Theme, das ich sehr gerne verwende. Es ist für mich persönlich sehr angenehm für die Augen. 8+ Stunden mit VS Code sind damit kein Problem mehr 😅.

Download

Prettier - Code formatter

Prettier ist ein Code Formatter, der es ermöglicht, den Code automatisch zu formatieren. Es ist auch sehr nützlich, wenn du mit mehreren Entwicklern an einem Projekt arbeitest damit nicht jeder seinen eigenen Code Style hat. Mit Prettier kannst du deinen Code automatisch formatieren und so sicherstellen, dass der Code immer gleich aussieht.

Download

SASS

SASS ist eine Erweiterung für VS Code, die es ermöglicht, SASS Dateien zu bearbeiten. Es bietet Syntax Highlighting, Code Snippets und vieles mehr. Wenn du SASS verwendest, dann ist diese Erweiterung ein Muss.

Download

Tailwind CSS IntelliSense

Tailwind CSS IntelliSense ermöglicht, Tailwind CSS Klassen automatisch zu vervollständigen. Es ist sehr nützlich, wenn du Tailwind CSS verwendest und dir die Klassen nicht merken kannst. Es bietet auch eine Vorschau für die Klassen, die du verwenden möchtest. Cool ist das in dieser Vorschau auch die Farben angezeigt werden und welche CSS Properties du damit verwendest.

Download

SQLite

Mit SQLite kannst du SQLite Datenbanken direkt in VS Code öffnen und anschauen.

Download

Template String Converter

Der Template String Converter wandelt automatisch eine Zeichenkette in ein Template String um wenn du JavaScript Variablen darin verwendest. Sehr nützlich wenn du nicht jedes mal von Hand die Quotes ändern möchtest. Kleiner Helfer aber Ohooo 😁.

Download

Thunder Client

Wenn du mit REST APIs arbeitest, dann ist Thunder Client ein Muss. Es ermöglicht, HTTP Requests direkt in VS Code zu erstellen und auszuführen. Es bietet viele nützliche Funktionen wie zum Beispiel das Speichern von Requests, das Speichern von Environments und vieles mehr.

Download

WSL

Windows Subsystem for Linux ermöglicht es, Linux Distributionen direkt in Windows zu verwenden. Ich verwende es, um meine Projekte in einer Linux Distribution Ubunutu zu entwickeln. Wenn du mit Docker arbeitest und die Docker Container direkt in Linux laufen lassen möchtest oder wenn du mit Node.js arbeitest und die Node.js Versionen direkt in Linux verwenden möchtest, dann kann ich diese Erweiterung nur empfehlen. Du Entwickelst direkt unter Linux, die grafische Oberfläche von VS Code wird aber von Windows gerendert. Das beste aus beiden Welten.

Download

Fazit

Das waren meine Favoriten. Ich hoffe, dass ich dir ein paar nützliche Plugins vorstellen konnte. Wenn du noch weitere Plugins kennst, die ich unbedingt ausprobieren sollte, dann schreib mir doch gerne auf Twitter oder schreib mir einen Kommentar auf YouTube.

Weitere Blog Artikel