一瞬でAWS上のインフラ構築が可能な「CloudFormation」　テンプレートを活用した環境構築デモ

alichan氏の自己紹介

alichan氏：では私のLTを始めたいと思います。今回は「CloudFormationで爆速インフラ構築」というテーマでお話ししたいと思います。

最初に私の自己紹介です。「あなたは誰？」ということで、とあるIT企業で働きながら、AWSとかJavaなどを用いてWeb開発を行っている人です。会社では主にCodeシリーズとECRを使用したコンテナ資源の移送だったり、EC2内でのログ監視やバッチ実行などを行っています。

プライベートでは、AWSに関する記事を「Zenn」に書いて公開したりしています。一緒に勉強をしたりプログラミングイベントに参加したりしてくれる方を募集中なので、気軽につながりましょう、ということでよろしくお願いします。

CloudFormationとは何か？

（スライドを示して）題名にもありますが、今日やることはこちらです。「CloudFormationで爆速インフラ構築」ということで、AWSのCloudFormationというIaCツールを用いて「AWS上のインフラ環境の構築を一瞬で行う方法」を紹介したいと思います。

具体的に「CloudFormationって何？」「どんなインフラ環境をどうやって構築するの？」というところを次のスライドから伝えていこうと思います。

知っている方も多いと思いますが、「CloudFormationって何？」ということで、簡単にCloudFormationについて説明しようと思います。CloudFormationというのは、AWSサービスによるインフラ環境構築を、設定ファイルとボタン押下のみで行ってくれるサービスになっています。

AWSサービスによるインフラ環境というのは、例えばEC2上にWebアプリケーションを載せて公開されているサービスとか、API GatewayとLamdaで作成されたWeb APIを公開するサービスなどがあると思いますが、EC2だったり、API Gatewayだったり、Lamdaなどを指しています。

ふだんみなさんもやっていると思いますが、AWSサービスを立ち上げるために、マネジメントコンソールから手動で一つひとつサービスを立ち上げていることを行わなくてよくなるというのが、CloudFormationの利点になっています。

yamlファイル内（テンプレート）の構造

この2点をわかりやすく説明してみようと思います。（スライドを示して）この左の画像が、私が前にZennで書いたReactアプリケーションを手動でEC2に載せて公開する記事です。

これを実際の実務の現場で作るとなったら、すごく長い手順書になってしまいます。これを順々に実行しないといけないところ、手動でReactアプリケーションを順々に立ち上げることしかできなかったところを、CloudFormationを利用することで、EC2の立ち上げとReactアプリケーション起動用の設定を記載したyamlファイルを設置して、環境構築の実行ボタンを押す。

それだけでReactアプリケーションを一発で立ち上げられるようになるということが、CloudFormationでできます。このyamlファイルがテンプレートと呼ばれています。

次のスライドは環境構築のyamlファイルになります。どういう構造になっているのか、どういう属性が存在するのかを簡単に紹介していこうと思います。

では、CloudFormationで実際に使用するテンプレートの構造を見ていきます。スライドに書かれているように、テンプレートを記載して環境構築を行っていきます。

テンプレートのトップレベルの属性に複数の定義された要素がありますが、一番重要なのが「Resources:」です。これだけあれば最悪立ち上がるといったプロパティになっています。では、実際に「Resources:にはどういうものを置くの？」というところを次のスライドから見ていこうと思います。

（スライドを示して）こちらは後半に見せるデモで使用するテンプレート内に記載されているResources:の一部を取り上げたものです。後半のデモではCloudFormationでEC2上にReactアプリケーションを載せてWeb上に公開するところを動画で撮ったので、それを公開します。

その際に立ち上げるリソースがResources:配下にいくつか記載されていますが、ここではその一部のEC2インスタンスの記載に焦点を当てて、配下の各プロパティについてざっくり説明していきます。

トップに記載されているのがEC2Instance:です。EC2Instance:というResources:配下のすぐ下に記載されているものがあります。これは論理IDといって自分で決められるものです。自分で好きな名前をリソースに付けられます。

「Type:」が起動するリソースを決定するもので、ここで「AWS::EC2::Instance」と書くことで、「EC2インスタンスの設定を記載したものだよ」という合図になっています。その下の「Properties:」は下にいくつかの属性がありますが、このリソースに対して設定できる固有の設定になっています。

例えばマネジメントコンソールからEC2を立ち上げた方ならわかると思いますが、立ち上げの際に「Imageld:」というインスタンスのOSを決定するものだったり、「InstanceType:」を使用するEC2インスタンスのハードウェアの性能を決定するものを選択してから立ち上げています。

こういったリソースを立ち上げる際に設定する値を書くことで、EC2インスタンス立ち上げの際に設定値が反映されるようになります。

テンプレート内では組み込み関数というものが使用できます。例えば「SecurityGroupIds:」の下にある「GetAtt:」というものは、Resources:配下の他のリソースに紐づく値を取ってくることができます。

今はEC2インスタンスしか書いていないのですが、他のところにSecurityGroupを乗せているので、設定したセキュリティグループの下のGroupIdというものを取ってくることができる関数になっています。

もう1個が「Ref:」という関数です。「SubnetId:」の下にある「Ref:」という関数がありますが、これも別のリソース、EC2インスタンス以外のサブネットというリソースを取ってきて、それのIDを参照することができる関数になっています。

以上、ざっくりとしたテンプレートの説明でした。

テンプレートでEC2上にReactアプリケーションを起動してWeb上に公開する

では、実際に用意したテンプレートを使用してEC2上にReactアプリケーションを起動して、Web上に公開してみます。（スライドを示して）今回作成するインフラ環境のアーキテクチャはこちらになっています。

EC2上にWebサーバーを提供するためのソフトウェアのNginxを載せて、その中にReactアプリケーションを格納します。そして、Web上にReactアプリケーションを公開するというところを動画で簡単にやります。

これを手動でマネジメントコンソールで行うと大変面倒くさいのですが、テンプレートファイルとボタンクリックの実行のみで構築していきます。

ではデモタイムということで、実際にCloudFormationで環境を構築していきます。

（画面を示して）今回用意したテンプレートというのはざっくりとこんな感じです。

「AWSTemplateFormatVersion」。テンプレートのバージョンがあって、「Description」という説明があって、「Resources:」というEC2インスタンスを入れるVPCだったり、サブネットだったりなどの設定があって、ルートテーブルがあってといった感じで、AWS上を立ち上げるサービスを順々に記載しています。

最後にEC2インスタンスです。（画面を示して）こちらはEC2インスタンスの説明が記載されているかたちになっています。これで実行すれば、Resources:配下のすべてのリソースが立ち上がるかたちになっています。

立ち上げているところを動画で共有しますので、それを見てもらいます。（画面を示して）これはCloudFormationの画面になっています。ここでスタックの作成という、実際のリソースの塊を立ち上げる設定をして、次にyamlファイルを設定しています。

設定をしたら「次へ」を押して、立ち上げるリソースのグループの名前を設定します。名前をreact-serverと決めて「次へ」を押して、「次へ」を押して。

そのあとは特に設定することもないので、これで実行ということで、ファイルからリソースを立ち上げています。

イベントで、立ち上がったリソースはどれかをどんどん更新して見せてくれます。CREATE_COMPLETEは「このリソースの配下にあったものが立ち上がったよ」という表示が出ています。

これを更新し続けると、最終的にはすべてのリソースが立ち上がるような状況になっています。react-server自体もCREATE_COMPLETEになったので、これでEC2インスタンスが立ち上がったはずです。

EC2インスタンスを調べてみると、実行しているインスタンスが1つあります。これを調べてみて、インスタンスIDを押下して、パブリックIPv4アドレスをコピペしてブラウザに貼り付けると、Nginxの初期ページが表示されるというかたちになっています。

しばらく経てばEC2の最初のスクリプトが実行されて、Reactを入れます。Reactを立ち上げるかたちになったので、Reactが立ち上がりました。

こんな感じで、簡単にReactのWebアプリケーションをWeb上に公開することができるようになっています。

以上が私の発表になります。CloudFormationの良さが少しでも伝わっていたらうれしいです。

今日話した内容とさらに複雑な環境構築を行っているZenn記事を公開しているので、「おもしろそうだな」と思った方がいたら、この記事も読んでもらえるとうれしいです。

ご清聴ありがとうございました。