AWS App Runnerを使ってサクッとNuxt.jsのアプリをデプロイしてみる

2021年7月21日 2021年10月3日

ウェブ系ウシジマくん

どうも、ウェブ系ウシジマくんです。

2021年5月にリリースされた、AWS App Runnerが最近所属しているコミュニティで盛んだったので、現在勉強中のNuxt.jsを使ったアプリをデプロイすることにしました。

ちょっとハマった箇所もあったのですが、無事デプロイできたので今回記事として紹介しようと思います。

AWS App Runnerとは？

AWS公式ページによると、次のように書かれています。

AWS App Runner は、コンテナ化されたウェブアプリケーションや API を開発者が簡単かつ迅速にデプロイできるフルマネージド型サービスです。大規模に、しかも事前のインフラ経験を必要とせずにデプロイすることができます。ソースコードからでも、コンテナイメージからでも始められます。App Runner がウェブアプリケーションを自動的にビルドおよびデプロイし、暗号化しつつトラフィックのロードバランスを実行します。また App Runner は、トラフィックのニーズに応じて自動的にスケールアップまたはスケールダウンします。App Runner を使用すれば、サーバーやスケーリングについて煩わされることもなく、アプリケーションに集中できる時間が増えます。
AWS App Runner -大規模な本番ウェブアプリケーションの開発を容易にする-

難しい単語が色々と並んでいますが、

コンテナ化されたアプリケーションがあれば、それをアップロードするだけで簡単にデプロイしてくれるツール

といったイメージでいいかと。

ちょっと雑な例えですが、Herokuと似たようなことがAWSで出来る様になったという感じでしょうか。

デプロイするのに必要なこと

AWS App Runnerでアプリケーションをデプロイするためには、

GItHubなどのソースコードを直接指定する方法
ECRにDocekrImageをアップロードする

上記いずれかの手順が必要です。

一番手軽なのはGitHubなどのソースコードを直接指定する方法ですが、こちらですとAWS App Runnerが利用しているALBのヘルスチェックに失敗してデプロイができませんでした。。

なので、今回はECRにDockerImageをアップロードする方法を紹介したいと思います。

デプロイ手順

今回手順を紹介するにあたって、サンプルリポジトリを用意しました。

https://github.com/yuta-ushijima/rojineko_view

アプリケーションを立ち上げると、猫の画像が表示されるシンプルなアプリです。

今回のキモとなるDockerfileを抜粋します。

FROM --platform=linux/amd64 node:12.20.0

# locale & timezone (Asia/Tokyo)
# https://github.com/moby/moby/issues/12084
ENV LANG C.UTF-8
ENV TZ Asia/Tokyo

# system update
RUN apt-get update && \
    apt-get install -y vim less

RUN mkdir -p /var/www/rojineko-view
WORKDIR /var/www/rojineko-view
COPY ./ /var/www/rojineko-view
RUN yarn install
RUN yarn build
ENV HOST 0.0.0.0
EXPOSE 3000

ENTRYPOINT ["yarn", "start"]

ポイントとなるのは、下記の部分です。