IDE (z.B. VS Code, IntelliJ), Texteditor (z.B. Sublime Text) beginner coding 80% Usefulness

Automatisierung von Boilerplate-Code mit Snippets

Lerne, wie du Code-Snippets in deiner IDE oder deinem Texteditor erstellst und verwendest, um wiederkehrenden Boilerplate-Code schnell zu generieren. Dies spart Zeit und reduziert Tippfehler, indem du komplexe Code-Strukturen mit wenigen Tastendrücken einfügst.

Originalvideo ansehen: Massive Claude Code & ChatGPT Updates! Neue Skills, Gemini E...
4 Schritte
1

Identifiziere wiederkehrenden Code

Überlege, welche Code-Blöcke du häufig schreibst (z.B. Funktionsdefinitionen, Klassenstrukturen, Import-Anweisungen).

Tipp: Achte auf Muster in deinem Code, die sich oft wiederholen.
2

Öffne die Snippet-Konfiguration

In VS Code gehst du zu 'File > Preferences > Configure User Snippets'. Wähle die Sprache aus, für die du das Snippet erstellen möchtest (z.B. 'javascript.json').

Tipp: Jede IDE hat einen eigenen Weg, Snippets zu konfigurieren. Suche nach 'Snippets' oder 'Code Templates' in den Einstellungen deiner IDE.
3

Definiere das Snippet

Füge ein JSON-Objekt hinzu, das den Namen, das Präfix (Trigger-Wort), den Body (den eigentlichen Code) und eine Beschreibung des Snippets enthält. Verwende '$1', '$2' für Tabstops und '$0' für den finalen Cursor-Platz.

{
  "Print to console": {
    "prefix": "log",
    "body": [
      "console.log('$1');",
      "$0"
    ],
    "description": "Log output to console"
  }
}
Tipp: Verwende Platzhalter wie '$1', '$2' usw., um festzulegen, wo der Cursor nach dem Einfügen des Snippets springen soll. '$0' ist der letzte Stopp.
Warnung: Achte auf die korrekte JSON-Syntax, um Fehler zu vermeiden.
4

Teste das Snippet

Öffne eine Datei der entsprechenden Sprache und tippe das definierte Präfix (z.B. 'log'). Die IDE sollte das Snippet vorschlagen. Wähle es aus und überprüfe, ob der Code korrekt eingefügt wird und die Tabstops funktionieren.

Tipp: Beginne mit einfachen Snippets und erweitere sie schrittweise.
← Alle Playbooks anzeigen