Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

--- werkzeuge:vscode:start [11.08.2026 18:41] – [Mein erstes Projekt mit VS Code] admin
+++ werkzeuge:vscode:start [29.09.2026 05:36] (aktuell) – admin
@@ Zeile 1: / Zeile 1: @@
-<WRAP rww-subpage-header>
+<WRAP rww-page-header>
+<WRAP rww-page-header-main>
-<WRAP rww-subpage-heading>
+<WRAP rww-page-title>
 ====== VS Code ======
 </WRAP>
-<WRAP rww-back>
+<WRAP rww-page-icon>
-[[werkzeuge:start|←]] [[werkzeuge:start|Werkzeuge]]
+<iconify mdi:microsoft-visual-studio-code>
+</WRAP>
 </WRAP>
+<WRAP rww-page-back>
+[[werkzeuge:start|← Werkzeuge]] · [[:start|Startseite]]
 </WRAP>
+</WRAP>
+----
 ===== Was ist Visual Studio Code? =====
@@ Zeile 35: / Zeile 41: @@
 Mein Ziel ist zunächst nicht, möglichst viele Funktionen von VS Code kennenzulernen. Ich möchte Schritt für Schritt genau die Werkzeuge verstehen, die ich bei meiner eigenen Arbeit tatsächlich benötige.
 ===== Meine Ausgangssituation =====
@@ Zeile 52: / Zeile 57: @@
 Diese Seite soll meinen tatsächlichen Lernweg begleiten. Funktionen werden deshalb erst ausführlicher dokumentiert, wenn ich sie kennenlerne und praktisch einsetze.
 ===== Meine Installation =====
@@ Zeile 99: / Zeile 103: @@
 Als Anzeigesprache ist bei mir **Deutsch** eingestellt.
+==== Farbdesign ====
+Für die Oberfläche von VS Code verwende ich das Farbdesign:
+<code>
+Dunkel Modern
+</code>
+Das Farbdesign kann über das Zahnrad unten links geändert werden:
+<code>
+Zahnrad → Designs → Farbdesign
+</code>
+Alternativ kann die Auswahl über folgendes Tastenkürzel geöffnet werden:
+<code>
+Strg + K
+Strg + T
+</code>
+Für meinen Einstieg verwende ich das mit VS Code mitgelieferte Farbdesign **Dunkel Modern**.
 ===== Die Oberfläche kennenlernen =====
@@ Zeile 104: / Zeile 132: @@
 Die wichtigsten Bereiche lerne ich direkt an einem echten Projekt kennen, statt die komplette Oberfläche theoretisch durchzugehen.
+{{:rww:infografiken:vscode_wichtigste_bereiche.png|Visual Studio Code – Meine wichtigsten Bereiche}}
 ==== Explorer ====
@@ Zeile 172: / Zeile 202: @@
 Commit- und weitere Git-Funktionen in VS Code werde ich erst verwenden, wenn ich ihren Ablauf praktisch kennengelernt habe.
 ===== Mein erstes Projekt mit VS Code =====
@@ Zeile 194: / Zeile 225: @@
 TheCruiserBlog dient mir damit als erstes praktisches Lernprojekt für VS Code.
 ===== Funktionen, die ich tatsächlich nutze =====
+Meine Liste der tatsächlich genutzten VS-Code-Funktionen wächst zusammen mit meiner praktischen Arbeit.
+Aktuell habe ich folgende Funktionen selbst verwendet:
+  * **Projektordner öffnen** → TheCruiserBlog als komplettes Projekt in VS Code öffnen
+  * **Explorer** → Ordner und Dateien des Projekts anzeigen
+  * **Editor** → eine Datei öffnen und deren Inhalt ansehen
+  * **Integriertes Terminal** → PowerShell direkt im Projektverzeichnis öffnen
+  * **Quellcodeverwaltung** → vorhandenes Git-Repository und den aktuellen Branch ''main'' anzeigen
+  * **Befehlspalette** → Anzeigesprache von VS Code auf Deutsch einstellen
+Weitere Funktionen ergänze ich erst, wenn ich sie tatsächlich verwendet habe.
 ===== Erweiterungen =====
+VS Code kann durch Erweiterungen um zusätzliche Funktionen ergänzt werden.
+Für meinen Einstieg installiere ich jedoch nicht sofort eine große Sammlung von Erweiterungen. Zunächst möchte ich die Grundfunktionen von VS Code kennenlernen und verstehen.
+Erweiterungen nehme ich erst dann auf, wenn ich für meine praktische Arbeit einen konkreten Bedarf dafür habe.
+So kann ich später auch nachvollziehen, welche Erweiterung ich installiert habe, warum ich sie benötige und welchen Nutzen sie mir tatsächlich bringt.
 ===== Tastenkürzel & kleine Helfer =====
+Hier sammle ich Tastenkürzel und kleine Hilfen, die mir bei meiner praktischen Arbeit mit VS Code tatsächlich begegnen.
+==== Befehlspalette öffnen ====
+<code>
+Strg + Umschalt + P
+</code>
+Die Befehlspalette ermöglicht den schnellen Zugriff auf zahlreiche Funktionen und Befehle von VS Code.
+Bei meinem Einstieg habe ich sie erstmals verwendet, um die Anzeigesprache auf Deutsch umzustellen.
+Weitere Tastenkürzel ergänze ich erst, wenn ich sie selbst verwendet habe und sie für meinen Arbeitsablauf nützlich sind.
+==== Farbdesign auswählen ====
+<code>
+Strg + K
+Strg + T
+</code>
+Die beiden Tastenkombinationen werden nacheinander ausgeführt.
+Damit öffne ich die Auswahl der verfügbaren Farbdesigns für die VS-Code-Oberfläche.
+Bei meinem Einstieg habe ich dieses Tastenkürzel verwendet, um das Farbdesign **Dunkel Modern** auszuwählen.
 ===== Probleme & Lösungen =====
+VS Code ist für mich noch neu. Deshalb dokumentiere ich hier Probleme und Stolpersteine, die mir bei der praktischen Arbeit tatsächlich begegnen.
+Für jeden Fall möchte ich möglichst festhalten:
+  * Was wollte ich machen?
+  * Was ist passiert?
+  * Welche Meldung wurde angezeigt?
+  * Was war die Ursache?
+  * Wie habe ich das Problem gelöst?
+Dieser Bereich wächst zusammen mit meiner praktischen Erfahrung.
+<WRAP rww-to-top>
+[[#vs_code|↑]]
+</WRAP>