Tutorials

Bitbucket einrichten und mit VS Code verbinden: Der komplette Guide

Melden

Hier ist ein umfassendes Tutorial, wie du Bitbucket einrichtest und nahtlos in Visual Studio Code (VS Code) integrierst.

Bitbucket ist eine leistungsstarke Plattform für die Versionsverwaltung, die auf Git basiert. In Kombination mit Visual Studio Code (VS Code) erhältst du eine hocheffiziente Entwicklungsumgebung. Dieser Guide führt dich Schritt für Schritt durch den Prozess.

1. Voraussetzungen

Bevor wir starten, stelle sicher, dass folgende Software auf deinem Rechner installiert ist:

2. Ein Repository in Bitbucket erstellen

Zuerst benötigen wir ein Projektverzeichnis (Repository) in der Cloud.

  1. Logge dich bei Bitbucket ein.
  2. Klicke auf den Button Create und wähle Repository.
  3. Gib deinem Repository einen Namen (z. B. mein-erstes-projekt).
  4. Wähle aus, ob es "Private" (nur für dich sichtbar) oder "Public" sein soll.
  5. Klicke auf Create repository.

3. SSH-Key einrichten (Empfohlen)

Damit du dich nicht bei jedem "Push" neu anmelden musst, ist die Verwendung eines SSH-Keys der beste Weg.

  1. SSH-Key generieren: Öffne dein Terminal (oder die Git Bash) und gib ein:
    ssh-keygen -t ed25519 -C "deine_email@beispiel.de"

    (Bestätige die Abfragen einfach mit Enter).

  2. Key kopieren: Zeige den Key an und kopiere ihn:
    cat ~/.ssh/id_ed25519.pub
  3. In Bitbucket hinterlegen:
    • Gehe in Bitbucket zu den Personal Settings (unten links auf dein Profilbild klicken).
    • Wähle unter "Security" den Punkt SSH Keys.
    • Klicke auf Add key, gib ihm einen Namen und füge den kopierten Code ein.

4. Repository in VS Code klonen

Jetzt bringen wir das Online-Repository auf deinen lokalen Computer.

  1. Gehe in Bitbucket zu deinem Repository.
  2. Klicke oben rechts auf den Button Clone.
  3. Wähle oben rechts im Dropdown SSH aus und kopiere den Link (z. B. git@bitbucket.org:user/repo.git).
  4. Öffne VS Code.
  5. Drücke Strg + Shift + P (Windows/Linux) oder Cmd + Shift + P (Mac), um die Befehlspalette zu öffnen.
  6. Tippe Git: Clone ein und drücke Enter.
  7. Füge den kopierten Link ein und wähle einen Ordner auf deinem PC aus, in dem das Projekt gespeichert werden soll.
  8. Klicke auf Open, sobald der Vorgang abgeschlossen ist.

5. Arbeiten mit VS Code und Bitbucket

Sobald das Projekt geöffnet ist, kannst du den integrierten Source-Control-Bereich nutzen.

Änderungen vornehmen (Commit & Push)

  1. Erstelle eine neue Datei (z. B. index.html) oder bearbeite eine vorhandene.
  2. Klicke links in der Seitenleiste auf das Source Control Icon (das Symbol mit den drei Punkten und Linien).
  3. Neben den geänderten Dateien siehst du ein + (Plus-Symbol). Klicke darauf, um die Änderungen zu "stagen" (vorzubereiten).
  4. Gib oben in das Textfeld eine Commit-Nachricht ein (z. B. Initialer Commit).
  5. Klicke auf den Haken (Commit).
  6. Klicke unten links auf das Synchronisierungs-Symbol oder auf den blauen Button Sync Changes / Push, um die Änderungen zu Bitbucket hochzuladen.

6. Nützliche Erweiterungen für VS Code

Um die Arbeit mit Bitbucket noch komfortabler zu machen, empfehle ich folgende Erweiterungen aus dem VS Code Marketplace:

  • Bitbucket Official Extension (Jira and Bitbucket): Ermöglicht es dir, Pull Requests direkt in VS Code zu verwalten und Issues einzusehen.
  • GitLens: Zeigt dir genau an, wer wann welche Zeile Code geändert hat (unverzichtbar für Teamarbeit).

7. Zusammenfassung der wichtigsten Befehle

Falls du lieber mit dem Terminal in VS Code arbeitest (Strg + ö), hier sind die wichtigsten Befehle:

  • git status – Zeigt den aktuellen Status deiner Dateien.
  • git add . – Fügt alle Änderungen zum Staging-Bereich hinzu.
  • git commit -m "Nachricht" – Speichert deine Änderungen lokal.
  • git push origin master (oder main) – Lädt die Änderungen zu Bitbucket hoch.
  • git pull – Holt die neuesten Änderungen von Bitbucket auf deinen Rechner.

Herzlichen Glückwunsch! Du hast Bitbucket erfolgreich eingerichtet und mit VS Code verknüpft. Viel Erfolg beim Programmieren!

0