21
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【Nuxt.js】AWS ECR/FargateにデプロイするためのDockerイメージ作成方法

Last updated at Posted at 2020-02-03

TL;DR.

  • AWS上でNext.js(SSR)アプリを動かすために、NuxtアプリをビルドするためのDockerイメージが必要
  • ローカル環境でdocker buildした後、ECRにDockerイメージをpushして、それをFargateにデプロイする

前提

  • Node.jsのパッケージは管理はyarnを利用
  • ローカル環境でNuxt.jsアプリが立ち上がる(yarn build / yarn startが実行できる)であること

ローカル環境での作業

1. ルート直下に以下のファイルを作成

Dockerfile
FROM node:12-alpine

ENV HOST 0.0.0.0

RUN mkdir -p /app
COPY . /app
WORKDIR /app

ARG ENV
ENV ENV $ENV

RUN yarn && yarn build

EXPOSE 3000

CMD ["yarn", "start"]
.dockerignore
node_modules/
.nuxt/

2. Dockerイメージの作成

$ docker build -t docker-image-name:0.0.1 .

3. 動作確認

以下コマンド実行後、ブラウザでhttp://localhost:3000にアクセス

$ docker container run -d -p 3000:3000 --name docker-image-name docker-image-name:0.0.1
--- container id が表示されている ---

4. dockerコンテナの停止+削除

$ docker stop xxxxx
$ docker rm xxxxx

xxxxxの部分は、上記で「docker container run」を実行した際にに出力されたコンテナIDを入力
(わからなければ、docker ps等で調べる)

作成したDockerイメージをECRにpush

1. Dockerイメージのタグ付け

$ docker tag docker-image-name:0.0.1 xxxxx.dkr.ecr.ap-northeast-1.amazonaws.com/docker-image-name:0.0.1

$ docker tag xxxxx.dkr.ecr.ap-northeast-1.amazonaws.com/docker-image-name:0.0.1 xxxxx.dkr.ecr.ap-northeast-1.amazonaws.com/docker-image-name:latest

2. Dockerイメージのpush

$ docker push xxxxx.dkr.ecr.ap-northeast-1.amazonaws.com/docker-image-name:latest

Fargateへのデプロイ

新しいdocker imageをlatestタグ付けしてECRにアップ後、Amazon ECS>クラスター>対象クラスタ>サービス名リンククリック>更新ボタンから、 新しいデプロイの強制にチェック入れて他そのままで更新すると、勝手にlatestでデプロイしてくれる(数分かかる)

ref: nuxtプロジェクトを独自ドメインでSSR(CloudFront -> ALB -> Fargate) - Qiita


AWS超初心者なので、何か誤った情報や誤解を招く表現があればご指摘ください

参考

21
14
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
21
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?