WEBデザイナーにサーバーレスでサイトを立ち上げられるか？ その① 立身編

この記事は公開されてから半年以上経過しています。情報が古い可能性がありますので、ご注意ください。

初めまして。2015年末より、SKYARCHのWEBを担当しておりますONAYAMIです。

( ・ω・)_ _))ﾍﾟｺﾘ

この程、新しく「サバ缶ポータルサイト」を立ち上げるに当たって…

そういえば弊社で作ってるサービスサイトはCloudぢゃないぢゃん！AWS使ってないぢゃん！！

CloudやAWSの会社でそんなんダメぢゃん！！( ˘• ₃ • )

という問題にぶつかり、これはぜひ、AWSを利用してみようかと、エンジニアの諸先輩方に相談した処

「どうせだったらS3を使って、サーバーレスで立ち上げたらいいぢゃん！」

とのお言葉を頂き、チャレンジしてみる事となりました。

まあ、サーバーサイドの知識はでんでん持ち合わせがないし

ましてやプログラム経験なぞJSとPHP程度の私ですが…がんばります！╭( ・ㅂ・)و ̑̑ ｸﾞｯ !

サバ缶ポータルの素材はローカル環境に準備完了↓

さて、初めてAWSを使ってみた、系のブログは弊社でも諸先輩方が書かれておりますのでそこは割愛。

今回はサーバーレスです。しかし、そもそもサーバーレスっちゃあなんじゃらほいって事なのですが…

( ꒪⌓꒪)？？

最初から、このサービスの為にこんだけの容量のサーバーを用意しましょう。という始め方ではなく、

まずは、ストレージの中で構築作業やっちゃって、立ち上げちゃおう！容量の管理やら障害対応は、

ストレージの方でよろしくね！という形のとても手軽なサービスの形。

確かにこれは、今後主流になりそうではあります。('ω'*)フムフム

しかしー

実は、それほど簡単な事ばかりではない！

※公開する時のドメインはどうするの？

※SSL証明書はどうするの？？

などの問題が予測されますが…それらへの対応も含め、まずは初めてみましょう。

初めてのサーバーレス！٩( ‘ω’ )و

実はサイト構築までは本当に簡単！

AWSコンソールにサインイン、サービスから「S3」を選びます。

「バケットの作成」ボタンを押す

バケットの名前を決めます。名前はドメインと同じモノが望ましいので、

今回用意しているドメイン「www.sabacan.info」を設定しました。

「www.sabacan.info」を開き、右クリック↑

ドラッグ＆ドロップで、データをアップロード

UPしたファイルを選択

公開設定にします。

バケットのプロパティ設定から「静的ウェブサイトホスティング」のタブを開き、

「ウェブサイトのホスティングを有効にする」を選択。

インデックスドキュメントのフォームにTOPページのファイル名を入力

次に「アクセス許可」のタブを開き、被付与者の設定を「全員」に。

FTPで言うところのパーミッション設定ですね。

「バケットポリシーの編集」のボタンを押して

バケットポリシーを書き加えます。これは公式にテンプレがあるので

コピーして、ドメイン名だけ書き換えます。

バケットポリシーの例

表示されたアドレスを開くと…

WEBができました！！

╰(´︶)╯


これはとっても簡単！たっのしー！！
 
 
しかし、ここにきて、1点問題が発生しました。
取得したドメインは「sabacan.info」なのですが、表示したいアドレスは「www.sabacan.info」
両方制御して、同じモノを表示したい！(ﾉｼ >ω<)ﾉｼ
 
という訳で、同様の要領で、「sabacan.info」のS3バケットを制作します。

もちろん、この時点では「sabacan.info」の中身はカラなので…
プロパティを開いて「静的ウェブサイトホスティング」のタブを開き、
「別のホスト名にすべてのリクエストをリダイレクトする」を選択して、
フォームにリダイレクト先となる「www.sabacan.info」と記述します。

これで、「sabacan.info」のプロパティ内にある「エンドポイント」というアドレスから
アクセスすると、バケット「www.sabacan.info」が、表示されます。