Freigeben über

Lernprogramm: Freigeben einer Container-App mit Visual Studio Code

Dieses Lernprogramm ist Teil zwei einer vierteiligen Reihe, die Docker für die Verwendung mit Visual Studio Code (VS Code) einführt.

In diesem Tutorial lernen Sie Folgendes:

  • Aktualisieren Sie den Code, und ersetzen Sie den Container.
  • Teilen Sie Ihr Bild.
  • Führen Sie das Bild auf einer neuen Instanz aus.

Voraussetzungen

Dieses Lernprogramm setzt das vorherige Lernprogramm fort, erstellen Sie eine Container-App mit Visual Studio Code. Um hier fortzufahren, benötigen Sie den ausführenden Todo-Listen-Manager aus Teil 1.

Aktualisieren des Codes und Ersetzen des Containers

Nehmen wir einige Änderungen vor, und erfahren Sie mehr über die Verwaltung Ihrer Container.

  1. Aktualisieren Sie in der src/static/js/app.js Datei Zeile 56 so, dass diese neue Beschriftung verwendet wird:

    - <p className="text-center">No items yet! Add one above!</p>
+ <p className="text-center">You have no todo items yet! Add one above!</p>

    Speichern Sie Ihre Änderung.

  2. Beenden Sie die aktuelle Version des Containers, und entfernen Sie sie. Mehrere Container können nicht denselben Port verwenden.

    Klicken Sie mit der rechten Maustaste auf den Container "Erste Schritte ", und wählen Sie "Entfernen" aus.

    Screenshot der Erweiterung

    Oder verwenden Sie in der Befehlszeile den folgenden Befehl, um die Container-ID abzurufen.

    docker ps

    Stoppen Sie dann den Container und entfernen Sie ihn.

    docker stop <container-id>
docker rm <container-id>

  3. Erstellen Sie die aktualisierte Version des Images. Klicken Sie im Datei-Explorer mit der rechten Maustaste auf Dockerfile, und wählen Sie dann "Image erstellen" aus.

    Wenn Sie an der Befehlszeile arbeiten möchten, wechseln Sie in das Verzeichnis mit dem Dockerfile und verwenden Sie denselben Befehl wie zuvor.

    docker build -t getting-started .

  4. Starten Sie einen neuen Container, der den aktualisierten Code verwendet.

    docker run -dp 3000:3000 getting-started

  5. Aktualisieren Sie Ihren Browser auf http://localhost:3000, um den aktualisierten Hilfetext anzuzeigen.

    Screenshot der Beispielanwendung mit dem oben beschriebenen geänderten Text.

Teilen Sie Ihr Bild

Nachdem Sie nun ein Image erstellt haben, können Sie es freigeben. Verwenden Sie zum Teilen von Containerimages eine Containerregistrierung. Die Standardregistrierung ist Docker Hub, wo alle verwendeten Images stammen.

Um ein Image zu pushen, müssen Sie zuerst ein Repository auf Docker Hub erstellen.

  1. Wechseln Sie zu Docker Hub , und melden Sie sich bei Ihrem Konto an.

  2. Wählen Sie "Repository erstellen" aus.

  3. Geben Sie getting-startedfür den Namen des Repositorys ein. Stellen Sie sicher, dass die Sichtbarkeitöffentlich ist.

  4. Wählen Sie "Erstellen" aus.

    Rechts auf der Seite wird ein Abschnitt mit dem Namen Docker-Befehle angezeigt. In diesem Abschnitt wird ein Beispielbefehl gezeigt, um einen Push an dieses Repository auszuführen.

    Screenshot der Docker Hub-Seite mit einem vorgeschlagenen Docker-Befehl.

  5. Klicken Sie im Container-Explorer unter REGISTRIES auf das Plug-Symbol, um eine Verbindung mit einer Registrierung herzustellen, und wählen Sie Docker Hub aus.

    Geben Sie Ihren Docker Hub-Kontonamen und Ihr Kennwort ein.

  6. Klicken Sie im Container-Explorer von VS Code unter IMAGES mit der rechten Maustaste auf das Imagetag, und wählen Sie "Push" aus. Geben Sie den Namespace und das Tag ein, oder übernehmen Sie die Standardwerte.

  7. Verwenden Sie dieses Verfahren, um mithilfe der Kommandozeile zu Docker Hub zu pushen.

    Melden Sie sich beim Docker Hub an:

    docker login -u <username>

  8. Verwenden Sie den folgenden Befehl, um das getting-started Bild umzubenennen.

    docker tag getting-started <username>/getting-started

  9. Verwenden Sie den folgenden Befehl, um Ihren Container zu pushen.

    docker push <username>/getting-started

Ausführen des Bilds auf einer neuen Instanz

Nachdem Ihr Image nun erstellt und in eine Registrierung verschoben wurde, versuchen Sie, die App auf einer völlig neuen Instanz auszuführen, die dieses Containerimage noch nie gesehen hat. Verwenden Sie "Play with Docker", um Ihre Anwendung auszuführen.

  1. Öffnen Sie Ihren Browser, um mit Docker zu spielen.

  2. Melden Sie sich mit Ihrem Docker Hub-Konto an.

  3. Wählen Sie "Start" und dann in der linken Seitenleiste den Link "+NEUE INSTANZ HINZUFÜGEN " aus. Nach ein paar Sekunden wird ein Terminalfenster in Ihrem Browser geöffnet.

    Screenshot zeigt die Website

  4. Starten Sie ihre App im Terminal.

    docker run -dp 3000:3000 <username>/getting-started

    Play with Docker lädt Ihr Image herunter und startet es.

  5. Wählen Sie das Abzeichen 3000 neben OPEN PORT aus. Sie sollten die App mit Ihren vorgenommenen Änderungen sehen.

    Wenn das 3000-Abzeichen nicht angezeigt wird, wählen Sie OPEN PORT aus und geben Sie den Port 3000 ein.

Bereinigen von Ressourcen

Bewahren Sie alles auf, was Sie bisher getan haben, um diese Reihe von Tutorials fortzusetzen.

Nächste Schritte

Glückwunsch. Sie haben Teil 2 abgeschlossen und erfahren, wie Sie Ihren Code aktualisieren und das Image auf einer neuen Instanz ausführen.

Im Folgenden finden Sie einige Ressourcen, die für Sie hilfreich sein können:

Probieren Sie als Nächstes das nächste Lernprogramm in dieser Reihe aus:

Daten speichern und eine Docker-App schichten