【Let's ハンズオン🤙】node.jsをDocker化してDocker run❗️【Express.js】
【Let's ハンズオン🤙】node.jsをDocker化してDocker run❗️
目次
- Dockerをインストール
- アプリを準備
- アプリをDocker化
- Docker run!!
Dockerをインストール
なにがともあれDockerを使用するので、自身の環境にDockerをインスト-ルしちゃいましょう!
Macの方はこちら
Windowsの方はこちら
下記のダウンロードのボタンをクリックでダウンロードが開始されます。
アプリを準備
Expressのアプリを作成しちゃいましょう!
まずは、Node.jsがインストールされているか確認です。
以下、二つのコマンドを実行して確認してみてください。
node -v
npm -v
ゆうじろうはこんな感じの表示がでました。
- node -v 結果
v16.14.0
- npm -v 結果
v8.3.1
では、アプリを作成していきましょう!
ExpressというNode.jsのフレームワークを使用するので、まずはインストールです。
npm install -g express-generator
これでExpressのアプリが簡単に作成できる様になりました。
では、作成していきましょう。
任意の場所にプロジェクト用のディレクトリを作成して、以下のコマンドを実行です。
express --view=ejs .
こんな感じの表示がでてきたら、yをクリックで続行です。
destination is not empty, continue? [y/N]
こんな感じの出力がされましたか?
destination is not empty, continue? [y/N] y
create : public/
create : public/javascripts/
create : public/images/
create : public/stylesheets/
create : public/stylesheets/style.css
create : routes/
create : routes/index.js
create : routes/users.js
create : views/
create : views/error.ejs
create : views/index.ejs
create : app.js
create : package.json
create : bin/
create : bin/www
install dependencies:
$ npm install
run the app:
$ DEBUG=express-react:* npm start
では、dependenciesをinstallしてほしいとのことなので、インストールしてあげましょう。
npm install
npm installができたら、アプリをローカル環境で実行しましょう!
npm start
> [ディレクトリ名]@0.0.0 start
> node ./bin/www
こんな感じの表示がでれば、以下へアクセスです!
以下の様な画面が表示されればアプリ作成成功です!
アプリをDocker化
次は作成したアプリをDocker Image化していきます。
プロジェクトのルート階層へ以下のファイル2つを作成してください。
- Dockerfile
- .dockerignore
Dockerfileの中身はこんな感じ
- Dockerfile
# 最初に調べたnodeのバージョンを記載
FROM node:16
# アプリケーションディレクトリを作成する
WORKDIR /usr/src/app
# アプリケーションの依存関係をインストールする
# ワイルドカードを使用して、package.json と package-lock.json の両方が確実にコピーされるようにします。
# 可能であれば (npm@5+)
COPY package*.json ./
RUN npm install
# アプリケーションのソースをバンドルする
COPY . .
# 開放するport番号を記載
EXPOSE 3000
CMD [ "npm", "start" ]
次は.dockerignoreファイルです。
これにより、ローカルモジュールとデバッグログが Docker イメージにコピーされたり、 イメージ内にインストールされているモジュールが上書きされたりするのを防ぐことができます。
- .dockerignore
node_modules
npm-debug.log
ここまで作成したら、Dockerのイメージを作成します。
docker build . -t express-app:v1
express-appのv1が作成されます。
DockerDesktopを見てみましょう。
imagesの箇所へDockerイメージが作成されていれば完了です!
以下のコマンドでも確認できます。
docker images
Docker run!!
ここまでくればもう簡単です。
以下のコマンドを実行し、Docker上でExpressで作成されたアプリを実行してください!
docker run -p 3000:3000 -d express-app:v1
-dオプションで実行しているので、バックグラウンドで実行中となります。
では、再度以下へアクセスしましょう!
見た目は変わりませんが、今度はDockerコンテナ上でのアプリの実行となります。
動作確認が終了したら、アプリを停止しておきましょう。
stopボタンでアプリを停止できます。
ハンズオンは以上となります!
Discussion