Ubuntu20.04でDockerを使用してNode.jsアプリケーションを構築する方法

投稿日: 2022-04-20 2022-04-20
タグ: Applications, Docker, Node.js, ubuntu

序章

Docker プラットフォームを使用すると、開発者はアプリケーションをコンテナーとしてパッケージ化して実行できます。コンテナは、共有オペレーティングシステム上で実行される分離されたプロセスであり、仮想マシンに代わる軽量の代替手段を提供します。コンテナは新しいものではありませんが、プロセスの分離や環境の標準化などの利点があり、分散アプリケーションアーキテクチャを使用する開発者が増えるにつれて重要性が増しています。

Dockerを使用してアプリケーションを構築およびスケーリングする場合、開始点は通常、アプリケーションのイメージを作成し、それをコンテナーで実行できるようにすることです。このイメージには、アプリケーションコード、ライブラリ、構成ファイル、環境変数、およびランタイムが含まれています。イメージを使用すると、コンテナー内の環境が標準化され、アプリケーションのビルドと実行に必要なものだけが含まれるようになります。

このチュートリアルでは、ExpressフレームワークとBootstrapを使用する静的Webサイトのアプリケーションイメージを作成します。次に、そのイメージを使用してコンテナーを作成し、将来使用するために DockerHubにプッシュします。最後に、Docker Hubリポジトリから保存されたイメージをプルして別のコンテナーを構築し、アプリケーションを再作成してスケーリングする方法を示します。

前提条件

このチュートリアルに従うには、次のものが必要です。

この初期サーバーセットアップガイドに従ってセットアップされた1つのUbuntu20.04サーバー。
Ubuntu20.04にDockerをインストールして使用する方法の手順1と2に従ってサーバーにDockerをインストールします。
Node.jsとnpmがインストールされ、NodeSourceによって管理されるPPAを使用してインストールするためのこれらの手順に従います。
DockerHubアカウント。これを設定する方法の概要については、DockerHubの使用を開始する際のこの紹介を参照してください。

ステップ1—アプリケーションの依存関係をインストールする

イメージを作成するには、最初にアプリケーションファイルを作成する必要があります。その後、このファイルをコンテナにコピーできます。これらのファイルには、アプリケーションの静的コンテンツ、コード、および依存関係が含まれます。

まず、root以外のユーザーのホームディレクトリにプロジェクトのディレクトリを作成します。これをnode_projectと呼びますが、これを別のものに自由に置き換える必要があります。

mkdir node_project

このディレクトリに移動します。

cd node_project

これがプロジェクトのルートディレクトリになります。

次に、プロジェクトの依存関係とその他の識別情報を使用してpackage.jsonファイルを作成します。 nanoまたはお気に入りのエディターでファイルを開きます。

nano package.json

プロジェクトの名前、作成者、ライセンス、エントリポイント、依存関係など、プロジェクトに関する次の情報を追加します。著者情報を自分の名前と連絡先の詳細に置き換えてください。

〜/ node_project / package.json

{
  "name": "nodejs-image-demo",
  "version": "1.0.0",
  "description": "nodejs image demo",
  "author": "Sammy the Shark <[email protected]>",
  "license": "MIT",
  "main": "app.js",
  "keywords": [
    "nodejs",
    "bootstrap",
    "express"
  ],
  "dependencies": {
    "express": "^4.16.4"
  }
}

このファイルには、プロジェクト名、作成者、および共有されているライセンスが含まれています。 Npm はを推奨し、プロジェクト名を短くわかりやすくし、npmレジストリでの重複を回避します。 MITライセンスをライセンスフィールドにリストし、アプリケーションコードの自由な使用と配布を許可します。

さらに、ファイルは以下を指定します。

"main"：アプリケーションのエントリポイントapp.js。次に、このファイルを作成します。
"dependencies"：プロジェクトの依存関係—この場合、Express4.16.4以降。

このファイルにはリポジトリがリストされていませんが、package.jsonファイルへのリポジトリの追加に関する次のガイドラインに従ってリポジトリを追加できます。アプリケーションをバージョン管理している場合、これは良い追加です。

変更が完了したら、ファイルを保存して閉じます。

プロジェクトの依存関係をインストールするには、次のコマンドを実行します。

npm install

これにより、プロジェクトディレクトリのpackage.jsonファイルにリストしたパッケージがインストールされます。

これで、アプリケーションファイルの作成に進むことができます。

ステップ2—アプリケーションファイルを作成する

サメに関する情報をユーザーに提供するウェブサイトを作成します。このアプリケーションには、メインのエントリポイントapp.jsと、プロジェクトの静的アセットを含むviewsディレクトリがあります。ランディングページindex.htmlは、ユーザーにいくつかの予備情報と、より詳細なサメ情報sharks.htmlを含むページへのリンクを提供します。 viewsディレクトリに、ランディングページとsharks.htmlの両方を作成します。

まず、メインプロジェクトディレクトリでapp.jsを開き、プロジェクトのルートを定義します。

nano app.js

ファイルの最初の部分は、ExpressアプリケーションとRouterオブジェクトを作成し、ベースディレクトリとポートを定数として定義します。

〜/ node_project / app.js

const express = require('express');
const app = express();
const router = express.Router();

const path = __dirname + '/views/';
const port = 8080;

require関数は、expressモジュールをロードします。このモジュールを使用して、appおよびrouterオブジェクトを作成します。 routerオブジェクトは、アプリケーションのルーティング機能を実行します。HTTPメソッドルートを定義するときに、それらをこのオブジェクトに追加して、アプリケーションがリクエストを処理する方法を定義します。

ファイルのこのセクションでは、pathとportという2つの定数も設定されています。

path：ベースディレクトリを定義します。これは、現在のプロジェクトディレクトリ内のviewsサブディレクトリになります。
port：アプリにリッスンしてポート8080にバインドするように指示します。

次に、routerオブジェクトを使用してアプリケーションのルートを設定します。

〜/ node_project / app.js

...

router.use(function (req,res,next) {
  console.log('/' + req.method);
  next();
});

router.get('/', function(req,res){
  res.sendFile(path + 'index.html');
});

router.get('/sharks', function(req,res){
  res.sendFile(path + 'sharks.html');
});

router.use関数は、ミドルウェア関数をロードします。この関数は、ルーターの要求をログに記録し、アプリケーションのルートに渡します。これらは後続の関数で定義されており、ベースプロジェクトURLへのGETリクエストはindex.htmlページを返し、/sharksルートへのGETリクエストはsharks.htmlを返す必要があります。 ]。

最後に、routerミドルウェアとアプリケーションの静的アセットをマウントし、ポート8080でリッスンするようにアプリに指示します。

〜/ node_project / app.js

...

app.use(express.static(path));
app.use('/', router);

app.listen(port, function () {
  console.log('Example app listening on port 8080!')
})

完成したapp.jsファイルは次のようになります。

〜/ node_project / app.js

const express = require('express');
const app = express();
const router = express.Router();

const path = __dirname + '/views/';
const port = 8080;

router.use(function (req,res,next) {
  console.log('/' + req.method);
  next();
});

router.get('/', function(req,res){
  res.sendFile(path + 'index.html');
});

router.get('/sharks', function(req,res){
  res.sendFile(path + 'sharks.html');
});

app.use(express.static(path));
app.use('/', router);

app.listen(port, function () {
  console.log('Example app listening on port 8080!')
})

終了したら、ファイルを保存して閉じます。

次に、静的コンテンツをアプリケーションに追加しましょう。 viewsディレクトリを作成することから始めます。

mkdir views

ランディングページファイルindex.htmlを開きます。

nano views/index.html

次のコードをファイルに追加します。これにより、Boostrapがインポートされ、より詳細なsharks.html情報ページへのリンクを含むjumbotronコンポーネントが作成されます。

〜/ node_project / views / index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <title>About Sharks</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <link href="css/styles.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Merriweather:400,700" rel="stylesheet" type="text/css">
</head>

<body>
    <nav class="navbar navbar-dark bg-dark navbar-static-top navbar-expand-md">
        <div class="container">
            <button type="button" class="navbar-toggler collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span>
            </button> <a class="navbar-brand" href="#">Everything Sharks</a>
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav mr-auto">
                    <li class="active nav-item"><a href="/" class="nav-link">Home</a>
                    </li>
                    <li class="nav-item"><a href="/sharks" class="nav-link">Sharks</a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="jumbotron">
        <div class="container">
            <h1>Want to Learn About Sharks?</h1>
            <p>Are you ready to learn about sharks?</p>
            <br>
            <p><a class="btn btn-primary btn-lg" href="/sharks" role="button">Get Shark Info</a>
            </p>
        </div>
    </div>
    <div class="container">
        <div class="row">
            <div class="col-lg-6">
                <h3>Not all sharks are alike</h3>
                <p>Though some are dangerous, sharks generally do not attack humans. Out of the 500 species known to researchers, only 30 have been known to attack humans.
                </p>
            </div>
            <div class="col-lg-6">
                <h3>Sharks are ancient</h3>
                <p>There is evidence to suggest that sharks lived up to 400 million years ago.
                </p>
            </div>
        </div>
    </div>
</body>

</html>

ここでのトップレベルのナビゲーションバーを使用すると、ユーザーはホームページとサメページを切り替えることができます。 navbar-navサブコンポーネントでは、Bootstrapのactiveクラスを使用して、現在のページをユーザーに示しています。 app.jsで定義したルートと一致する静的ページへのルートも指定しました。

〜/ node_project / views / index.html

...
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
   <ul class="nav navbar-nav mr-auto">
      <li class="active nav-item"><a href="/" class="nav-link">Home</a>
      </li>
      <li class="nav-item"><a href="/sharks" class="nav-link">Sharks</a>
      </li>
   </ul>
</div>
...

さらに、ジャンボトロンのボタンにサメ情報ページへのリンクを作成しました。

〜/ node_project / views / index.html

...
<div class="jumbotron">
   <div class="container">
      <h1>Want to Learn About Sharks?</h1>
      <p>Are you ready to learn about sharks?</p>
      <br>
      <p><a class="btn btn-primary btn-lg" href="/sharks" role="button">Get Shark Info</a>
      </p>
   </div>
</div>
...

ヘッダーにはカスタムスタイルシートへのリンクもあります。

〜/ node_project / views / index.html

...
<link href="css/styles.css" rel="stylesheet">
...

このステップの最後に、このスタイルシートを作成します。

終了したら、ファイルを保存して閉じます。

アプリケーションのランディングページを配置すると、サメ情報ページsharks.htmlを作成できます。このページでは、関心のあるユーザーにサメに関する詳細情報を提供します。

ファイルを開きます。

nano views/sharks.html

次のコードを追加します。これは、Bootstrapとカスタムスタイルシートをインポートし、特定のサメに関する詳細情報をユーザーに提供します。

〜/ node_project / views / sharks.html

<!DOCTYPE html>
<html lang="en">

<head>
    <title>About Sharks</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <link href="css/styles.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Merriweather:400,700" rel="stylesheet" type="text/css">
</head>
<nav class="navbar navbar-dark bg-dark navbar-static-top navbar-expand-md">
    <div class="container">
        <button type="button" class="navbar-toggler collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span>
        </button> <a class="navbar-brand" href="/">Everything Sharks</a>
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav mr-auto">
                <li class="nav-item"><a href="/" class="nav-link">Home</a>
                </li>
                <li class="active nav-item"><a href="/sharks" class="nav-link">Sharks</a>
                </li>
            </ul>
        </div>
    </div>
</nav>
<div class="jumbotron text-center">
    <h1>Shark Info</h1>
</div>
<div class="container">
    <div class="row">
        <div class="col-lg-6">
            <p>
                <div class="caption">Some sharks are known to be dangerous to humans, though many more are not. The sawshark, for example, is not considered a threat to humans.
                </div>
                <img src="https://assets.digitalocean.com/articles/docker_node_image/sawshark.jpg" alt="Sawshark">
            </p>
        </div>
        <div class="col-lg-6">
            <p>
                <div class="caption">Other sharks are known to be friendly and welcoming!</div>
                <img src="https://assets.digitalocean.com/articles/docker_node_image/sammy.png" alt="Sammy the Shark">
            </p>
        </div>
    </div>
</div>

</html>

このファイルでは、現在のページを示すためにactiveクラスを再び使用していることに注意してください。

終了したら、ファイルを保存して閉じます。

最後に、最初にviewsディレクトリにcssフォルダーを作成して、index.htmlおよびsharks.htmlにリンクしたカスタムCSSスタイルシートを作成します。

mkdir views/css

スタイルシートを開きます。

nano views/css/styles.css

次のコードを追加します。これにより、ページに必要な色とフォントが設定されます。

〜/ node_project / views / css / styles.css

.navbar {
	margin-bottom: 0;
}

body {
	background: #020A1B;
	color: #ffffff;
	font-family: 'Merriweather', sans-serif;
}

h1,
h2 {
	font-weight: bold;
}

p {
	font-size: 16px;
	color: #ffffff;
}

.jumbotron {
	background: #0048CD;
	color: white;
	text-align: center;
}

.jumbotron p {
	color: white;
	font-size: 26px;
}

.btn-primary {
	color: #fff;
	text-color: #000000;
	border-color: white;
	margin-bottom: 5px;
}

img,
video,
audio {
	margin-top: 20px;
	max-width: 80%;
}

div.caption: {
	float: left;
	clear: both;
}

このファイルは、フォントと色の設定に加えて、max-widthを80％に指定することにより、画像のサイズを制限します。これにより、ページ上で必要以上のスペースを占有するのを防ぐことができます。

終了したら、ファイルを保存して閉じます。

アプリケーションファイルが配置され、プロジェクトの依存関係がインストールされたら、アプリケーションを起動する準備が整います。

前提条件の初期サーバーセットアップチュートリアルに従った場合、SSHトラフィックのみを許可するアクティブなファイアウォールがあります。ポート8080へのトラフィックを許可するには、次のコマンドを実行します。

sudo ufw allow 8080

アプリケーションを起動するには、プロジェクトのルートディレクトリにいることを確認してください。

cd ~/node_project

node app.jsでアプリケーションを起動します。

node app.js

ブラウザをhttp://your_server_ip:8080に移動します。次のランディングページをロードします。

Application Landing Page

Get SharkInfoボタンをクリックします。次の情報ページが読み込まれます。

Shark Info Page

これで、アプリケーションが稼働しています。準備ができたら、CTRL+Cと入力してサーバーを終了します。これで、Dockerfileの作成に進むことができます。これにより、このアプリケーションを必要に応じて再作成およびスケーリングできます。

ステップ3—Dockerfileを作成する

Dockerfileは、実行時にアプリケーションコンテナに含まれるものを指定します。 Dockerfileを使用すると、コンテナー環境を定義し、依存関係やランタイムバージョンとの不一致を回避できます。

最適化されたコンテナの構築に関するこれらのガイドラインに従い、画像レイヤーの数を最小限に抑え、画像の機能を単一の目的（アプリケーションファイルと静的コンテンツの再作成）に制限することで、画像を可能な限り効率的にします。

プロジェクトのルートディレクトリに、Dockerfileを作成します。

nano Dockerfile

Dockerイメージは、相互に構築される一連のレイヤードイメージを使用して作成されます。最初のステップは、アプリケーションビルドの開始点を形成するアプリケーションのベースイメージを追加することです。

node：10-alpine image を使用しましょう。これは、執筆時点では、Node.jsの推奨LTSバージョンであるためです。 alpineイメージは、 Alpine Linux プロジェクトから派生しており、イメージサイズを小さく抑えるのに役立ちます。 alpineイメージがプロジェクトに適しているかどうかの詳細については、DockerHubノードイメージページのImageVariantsセクションの詳細な説明を確認してください[ X213X]。

次のFROM命令を追加して、アプリケーションのベースイメージを設定します。

〜/ node_project / Dockerfile

FROM node:10-alpine

このイメージには、Node.jsとnpmが含まれています。各Dockerfileは、FROM命令で始まる必要があります。

デフォルトでは、Dockerノードイメージにはルート以外の node ユーザーが含まれており、アプリケーションコンテナをrootとして実行しないようにするために使用できます。コンテナをrootとして実行することを避け、コンテナ内の機能をプロセスの実行に必要なものだけに制限することをお勧めします。したがって、 node ユーザーのホームディレクトリをアプリケーションの作業ディレクトリとして使用し、コンテナ内のユーザーとして設定します。 Docker Nodeイメージを操作する際のベストプラクティスの詳細については、このベストプラクティスガイドを確認してください。

コンテナ内のアプリケーションコードの権限を微調整するために、/home/nodeにnode_modulesサブディレクトリをappディレクトリと一緒に作成しましょう。これらのディレクトリを作成すると、必要な権限が確実に付与されます。これは、npm installを使用してコンテナにローカルノードモジュールを作成するときに重要になります。これらのディレクトリを作成することに加えて、それらの所有権をnodeユーザーに設定します。

〜/ node_project / Dockerfile

...
RUN mkdir -p /home/node/app/node_modules && chown -R node:node /home/node/app

RUN命令を統合するユーティリティの詳細については、このコンテナーレイヤーの管理方法に関するディスカッションをお読みください。

次に、アプリケーションの作業ディレクトリを/home/node/appに設定します。

〜/ node_project / Dockerfile

...
WORKDIR /home/node/app

WORKDIRが設定されていない場合、Dockerはデフォルトで作成するため、明示的に設定することをお勧めします。

次に、package.jsonおよびpackage-lock.json（npm 5以降の場合）ファイルをコピーします。

〜/ node_project / Dockerfile

...
COPY package*.json ./

npm installを実行する前、またはアプリケーションコードをコピーする前に、このCOPY命令を追加すると、Dockerのキャッシュメカニズムを利用できます。ビルドの各段階で、Dockerはその特定の命令用にキャッシュされたレイヤーがあるかどうかを確認します。 package.jsonを変更すると、このレイヤーが再構築されますが、変更しない場合、この命令により、Dockerは既存のイメージレイヤーを使用して、ノードモジュールの再インストールをスキップできます。

node_modulesディレクトリの内容を含め、すべてのアプリケーションファイルが非ルート node ユーザーによって所有されていることを確認するには、実行する前にユーザーをnodeに切り替えます。 npm install：

〜/ node_project / Dockerfile

...
USER node

プロジェクトの依存関係をコピーしてユーザーを切り替えた後、npm installを実行できます。

〜/ node_project / Dockerfile

...
RUN npm install

次に、適切な権限を持つアプリケーションコードをコンテナのアプリケーションディレクトリにコピーします。

〜/ node_project / Dockerfile

...
COPY --chown=node:node . .

これにより、アプリケーションファイルが非ルートnodeユーザーによって所有されるようになります。

最後に、コンテナのポート8080を公開し、アプリケーションを起動します。

〜/ node_project / Dockerfile

...
EXPOSE 8080

CMD [ "node", "app.js" ]

EXPOSEはポートを公開しませんが、代わりに、コンテナー上のどのポートが実行時に公開されるかを文書化する方法として機能します。 CMDは、コマンドを実行してアプリケーションを起動します。この場合は、 nodeapp.jsです。各DockerfileにはCMD命令が1つだけ存在する必要があることに注意してください。複数含める場合は、最後のもののみが有効になります。

Dockerfileでできることはたくさんあります。手順の完全なリストについては、DockerのDockerfileリファレンスドキュメントを参照してください。

完全なDockerfileは次のようになります。

〜/ node_project / Dockerfile


FROM node:10-alpine

RUN mkdir -p /home/node/app/node_modules && chown -R node:node /home/node/app

WORKDIR /home/node/app

COPY package*.json ./

USER node

RUN npm install

COPY --chown=node:node . .

EXPOSE 8080

CMD [ "node", "app.js" ]

編集が終了したら、ファイルを保存して閉じます。

アプリケーションイメージを作成する前に、.dockerignoreファイルを追加しましょう。 .gitignoreファイルと同様に機能する.dockerignoreは、プロジェクトディレクトリ内のどのファイルとディレクトリをコンテナにコピーしないかを指定します。

.dockerignoreファイルを開きます。

nano .dockerignore

ファイル内に、ローカルノードモジュール、npmログ、Dockerfile、および.dockerignoreファイルを追加します。

〜/ node_project / .dockerignore

node_modules
npm-debug.log
Dockerfile
.dockerignore

Git を使用している場合は、.gitディレクトリと.gitignoreファイルも追加する必要があります。

終了したら、ファイルを保存して閉じます。

これで、 dockerbuildコマンドを使用してアプリケーションイメージをビルドする準備が整いました。 -tフラグをdocker buildと一緒に使用すると、覚えやすい名前で画像にタグを付けることができます。イメージをDockerHubにプッシュするので、DockerHubのユーザー名をタグに含めましょう。画像にnodejs-image-demoのタグを付けますが、これを自由に選択した名前に置き換えてください。また、your_dockerhub_usernameを独自のDockerHubユーザー名に置き換えることを忘れないでください。

sudo docker build -t your_dockerhub_username/nodejs-image-demo .

.は、ビルドコンテキストが現在のディレクトリであることを指定します。

イメージの作成には1〜2分かかります。完了したら、画像を確認します。

sudo docker images

次の出力が表示されます。

OutputREPOSITORY                                         TAG                 IMAGE ID            CREATED             SIZE
your_dockerhub_username/nodejs-image-demo          latest              1c723fb2ef12        8 seconds ago       73MB
node                                               10-alpine           f09e7c96b6de        3 weeks ago        70.7MB

docker run を使用して、このイメージでコンテナーを作成できるようになりました。このコマンドには、次の3つのフラグが含まれます。

-p：これにより、コンテナーのポートが公開され、ホストのポートにマップされます。ホストではポート80を使用しますが、そのポートで別のプロセスを実行している場合は、必要に応じてこれを自由に変更してください。これがどのように機能するかについての詳細は、ポートバインディングに関するDockerドキュメントのこの説明を確認してください。
-d：これはコンテナーをバックグラウンドで実行します。
--name：これにより、コンテナーに覚えやすい名前を付けることができます。

次のコマンドを実行して、コンテナーを作成します。

sudo docker run --name nodejs-image-demo -p 80:8080 -d your_dockerhub_username/nodejs-image-demo

コンテナーが稼働状態になったら、 dockerpsを使用して実行中のコンテナーのリストを検査できます。

sudo docker ps

次の出力が表示されます。

OutputCONTAINER ID        IMAGE                                                   COMMAND             CREATED             STATUS              PORTS                  NAMES
e50ad27074a7        your_dockerhub_username/nodejs-image-demo               "node app.js"       8 seconds ago       Up 7 seconds        0.0.0.0:80->8080/tcp   nodejs-image-demo

コンテナが実行されている状態で、ポートなしでブラウザをサーバーIPに移動することで、アプリケーションにアクセスできます。

http://your_server_ip

アプリケーションのランディングページが再度読み込まれます。

Application Landing Page

アプリケーションのイメージを作成したので、将来使用するためにそれをDockerHubにプッシュできます。

ステップ4—リポジトリを使用して画像を操作する

アプリケーションイメージをDockerHubなどのレジストリにプッシュすることで、コンテナーを構築およびスケーリングするときに後で使用できるようになります。アプリケーションイメージをリポジトリにプッシュし、そのイメージを使用してコンテナを再作成することにより、これがどのように機能するかを示します。

イメージをプッシュするための最初のステップは、前提条件で作成したDockerHubアカウントにログインすることです。

sudo docker login -u your_dockerhub_username

プロンプトが表示されたら、DockerHubアカウントのパスワードを入力します。この方法でログインすると、DockerHubのクレデンシャルを使用してユーザーのホームディレクトリに~/.docker/config.jsonファイルが作成されます。

これで、前に作成したタグyour_dockerhub_username/nodejs-image-demoを使用して、アプリケーションイメージをDockerHubにプッシュできます。

sudo docker push your_dockerhub_username/nodejs-image-demo

現在のアプリケーションコンテナとイメージを破棄し、リポジトリ内のイメージを使用してそれらを再構築することにより、イメージレジストリの有用性をテストしてみましょう。

まず、実行中のコンテナを一覧表示します。

sudo docker ps

次の出力が得られます。

OutputCONTAINER ID        IMAGE                                       COMMAND             CREATED             STATUS              PORTS                  NAMES
e50ad27074a7        your_dockerhub_username/nodejs-image-demo   "node app.js"       3 minutes ago       Up 3 minutes        0.0.0.0:80->8080/tcp   nodejs-image-demo

出力にリストされているCONTAINER IDを使用して、実行中のアプリケーションコンテナーを停止します。以下で強調表示されているIDを、必ず独自のCONTAINER IDに置き換えてください。

sudo docker stop e50ad27074a7

-aフラグを使用してすべての画像を一覧表示します。

docker images -a

次の出力が、イメージの名前your_dockerhub_username/nodejs-image-demoとともに、nodeイメージおよびビルドからの他のイメージとともに受信されます。

OutputREPOSITORY                                           TAG                 IMAGE ID            CREATED             SIZE
your_dockerhub_username/nodejs-image-demo            latest              1c723fb2ef12        7 minutes ago       73MB
<none>                                               <none>              2e3267d9ac02        4 minutes ago       72.9MB
<none>                                               <none>              8352b41730b9        4 minutes ago       73MB
<none>                                               <none>              5d58b92823cb        4 minutes ago       73MB
<none>                                               <none>              3f1e35d7062a        4 minutes ago       73MB
<none>                                               <none>              02176311e4d0        4 minutes ago       73MB
<none>                                               <none>              8e84b33edcda        4 minutes ago       70.7MB
<none>                                               <none>              6a5ed70f86f2        4 minutes ago       70.7MB
<none>                                               <none>              776b2637d3c1        4 minutes ago       70.7MB
node                                                 10-alpine           f09e7c96b6de        3 weeks ago         70.7MB

次のコマンドを使用して、停止したコンテナと、未使用またはぶら下がっているイメージを含むすべてのイメージを削除します。

docker system prune -a

出力でプロンプトが表示されたら、yと入力して、停止したコンテナーとイメージを削除することを確認します。これにより、ビルドキャッシュも削除されることに注意してください。

これで、アプリケーションイメージを実行しているコンテナとイメージ自体の両方が削除されました。 Dockerコンテナー、イメージ、およびボリュームの削除の詳細については、 Dockerイメージ、コンテナー、およびボリュームを削除する方法を確認してください。

すべてのイメージとコンテナーが削除されたので、DockerHubからアプリケーションイメージをプルできます。

docker pull your_dockerhub_username/nodejs-image-demo

画像をもう一度リストします。

docker images

出力には、アプリケーションイメージが含まれます。

OutputREPOSITORY                                     TAG                 IMAGE ID            CREATED             SIZE
your_dockerhub_username/nodejs-image-demo      latest              1c723fb2ef12        11 minutes ago      73MB

これで、ステップ3のコマンドを使用してコンテナーを再構築できます。

docker run --name nodejs-image-demo -p 80:8080 -d your_dockerhub_username/nodejs-image-demo

実行中のコンテナを一覧表示します。

docker ps

OutputCONTAINER ID        IMAGE                                                   COMMAND             CREATED             STATUS              PORTS                  NAMES
f6bc2f50dff6        your_dockerhub_username/nodejs-image-demo               "node app.js"       4 seconds ago       Up 3 seconds        0.0.0.0:80->8080/tcp   nodejs-image-demo

もう一度http://your_server_ipにアクセスして、実行中のアプリケーションを表示します。

結論

このチュートリアルでは、ExpressとBootstrapを使用して静的Webアプリケーションを作成し、このアプリケーションのDockerイメージを作成しました。このイメージを使用してコンテナーを作成し、イメージをDockerHubにプッシュしました。そこから、イメージとコンテナを破棄し、DockerHubリポジトリを使用してそれらを再作成することができました。

DockerComposeやDockerMachineなどのツールを使用してマルチコンテナーセットアップを作成する方法について詳しく知りたい場合は、次のガイドを参照してください。

コンテナデータの操作に関する一般的なヒントについては、以下を確認してください。

他のDocker関連のトピックに興味がある場合は、Dockerチュートリアルの完全なライブラリを見つけてください。

getdocs

13036