GridsomeやNuxtからでbuildした静的サイトをホスティングする時にNetlifyをいつも用いるのですが、公開前のサイトでベーシック認証をかけたかったのでNetlifyの代わりとなるものを探しました。

Netlifyでもできますが、ベーシック認証はProプラン（＄45/月）で有料なので外しました。

Plans and Pricing | Netlify

調べた所Amplifyを使えば簡単にベーシック認証をつけて静的サイトホスティングができるとのことで早速やってみると簡単にデプロイできました。

料金

料金は下記です。ちなみにシンプルなGridosmeの1ページだけのプロジェクトで4分程ビルドに時間がかかっていました。

AWS Amplify Console – Pricing

aws無料期間の場合の料金

テスト的に使ってみる場合では無料で使えそうですね。

BUILD & DEPLOY

1000 build minutes per month

HOSTING

5 GB stored per month

15 GB served per month

The free tier expires at the end of your 12 month AWS Free Tier term.

無料期間終了後の料金

ビルドに5分かかるとすれば、1回 $0.05 程ですね。HOSTINGの方はわかりませんが...

BUILD & DEPLOY

$0.01 per build minute

HOSTING

$0.023 per GB stored per month

$0.15 per GB served

デプロイ手順

aws登録→Amplify コンソール

Githubなどリポジトリを連携して、ビルド設定を書きます。

amplify.yml

version: 0.1
frontend:
  phases:
    preBuild:
      commands:
        - yarn install
    build:
      commands:
        - yarn run build
  artifacts:
    baseDirectory: dist
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

書き換えた所といえば baseDirectory: dist ぐらいで他はデフォルトで設定されていました。

Amplifyコンソールでベーシック認証の設定

Amplify コンソール → アプリの設定 → アクセスコントロール

から画像のように設定するだけです。

（初回デプロイ後にこのメニューは触れます。1秒たりとも公開したくなければ空の状態でデプロイするかビルド中に設定すると良いでしょう）

basic auth

参考サイト

# AWS

Amplifyコンソールで静的サイトをデプロイ(ベーシック認証付き)