教學課程：在 Visual Studio Code 中共用 Docker 應用程式

本教學課程是四部分的第 2 部分，其中介紹 Docker 以便搭配 Visual Studio Code (VS Code) 使用。

在本教學課程中，您會了解如何：

必要條件

本教學課程延續上一個教學課程：使用 Visual Studio Code 建立 Docker 應用程式。若要繼續，您需要第 1 部分的執行待辦事項清單管理員。

讓我們進行一些變更，並了解如何管理您的容器。

在 src/static/js/app.js 檔案中，更新第 56 行以使用這個新文字標籤：

- <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>

儲存您的變更。

現在您已建置映像，可加以共用。若要共用 Docker 映像，請使用 Docker 登錄。預設登錄是 Docker Hub，也就是我們使用的所有映像都來自該處。

若要推送映像，您必須先在 Docker Hub 上建立存放庫。

移至 Docker Hub 並登入您的帳戶。
選取 [建立存放庫]。
針對存放庫名稱，輸入 getting-started。確定 [可見度] 為 [公用]。
選取建立。

在頁面右側，您會看到名為 [Docker 命令]的區段。本節提供要執行的範例命令，以推送至此存放庫。
在 VS Code 的 Docker 檢視中，於 [REGISTRIES] 底下，按一下外掛程式圖示以連線到登錄，然後選擇 [Docker Hub]。

輸入您的 Docker Hub 帳戶名稱和密碼。
在 VS Code 的 Docker 檢視中，於 [IMAGES] 底下，以滑鼠右鍵按一下映像標籤，然後選取 [推送]。輸入命名空間和標記，或接受預設值。
若要使用命令列推送至 Docker Hub，請使用此程序。

登入 Docker Hub：
```
docker login -u <username>
```
使用下列命令，為 getting-started 映像提供新名稱。
```
docker tag getting-started <username>/getting-started
```
使用下列命令來推送您的容器。
```
docker push <username>/getting-started
```

既然您的映像已建置並推送至登錄，請嘗試在從未見過此容器映像的全新執行個體上執行應用程式。若要執行您的應用程式，請使用 Play with Docker。

將瀏覽器開啟至 Play with Docker。
使用您的 Docker Hub 帳戶登入。
選取 [開始]，然後在左側提要欄位中選取 [+ 新增執行個體] 連結。幾秒鐘後，終端機視窗會在瀏覽器中開啟。
在終端機中，啟動您的應用程式。
```
docker run -dp 3000:3000 <username>/getting-started
```
Play with Docker 會下拉您的映像並加以啟動。
選取 [開啟連接埠] 旁邊的 3000 徽章。您應會看到包含修改的應用程式。

如果 3000 徽章未顯示，請選取 [開啟連接埠]，然後輸入 3000。

請保留到目前為止您所做的一切，以繼續這一系列的教學課程。

恭喜! 您已完成第 2 部分並了解如何更新程式碼，以及在新的映像上執行映像。

以下是一些對您可能有用的資源：

接下來，嘗試本系列中的下一個教學課程：