NearBy

ちょっぴり役に立つ情報を発信しているブログです。

S3を使って簡単独自ドメインWEBサイト公開方法

はじめに

WEBサイトを公開したいときは、どうしていますか?

サーバーを借りて、ドメイン当てて...

今回は簡単に自分のWEBサイトをS3とRoute53を利用して公開する方法について書きます。

非エンジニアの方でも大丈夫!

S3でWEBサイトを公開する

Route53でドメイン取得

まずは、独自のドメインを取得しちゃいましょう。

AWSのconsoleからRoute53のページに飛んで好きなドメインを取得します。(有料) AWS マネジメントコンソール | AWS

f:id:zawank0:20180404080935p:plain

取得したら、今回のWEBサイトを公開するURLを決めておきましょう。

下記が例です。(ポートフォリオを公開する想定)

portfolio.mydomain

バケットを作る

次は、S3でバケットを作成します。

同じくAWS ConsoleのS3のページに行き、上で決めたURL(portfolio.mydomain)のバケットを作成します。

作成 f:id:zawank0:20180404081405p:plain

バケット名は、先ほど決めたもの f:id:zawank0:20180404081359p:plain

あとは基本的に、デフォルトの設定で進めて大丈夫です。

ファイルをアップロード

作成したら、ファイル群をアップロードします。

バケットでアップロード

ローカルのファイルをそのまま持ってきてしまいましょう。 f:id:zawank0:20180404081556p:plain

公開

次に、公開するために作成したバケットのプロパティで、static website hostingを有効化します。 f:id:zawank0:20180404081839p:plain

そしてアクセス権限のパケットポリシーを下記のように更新します。

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "AddPerm",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::それぞれのバケットネーム(portfolio.mydomain)*"
        }
    ]
}

最後に独自ドメインを当てるためにRoute53のページに戻り、先ほど取得したドメインを選択し、Create Record Set を押して、Nameにportfolio とし、 Alias をyesにすると、AliasTargetに先ほど作成したS3が表示されると思います。

これで、数分待てばportfolio.mydomain でwebサイトが公開できます。

まとめ

簡単に独自ドメイン取得から、公開までできました。