読者です 読者をやめる 読者になる 読者になる

いつブロ

いつまで続くか分からないブログ(仮)主に趣味やプログラミングに関するメモを書いています。

☆初登壇☆JAWS-UG大阪 第18回勉強会 サーバーレス #jawsug

AWS サーバーレス 勉強会

f:id:koichi0814:20170226230514j:plain

jawsugosaka.doorkeeper.jp

AWS歴半年でサーバーレスに関する内容で登壇して来ました。
最近話題のサーバーレスという事で参加者が増えすぎたので3会場繋いでやりました。
初めての登壇なのに大丈夫かな?
3会場同時なんかどうやるの?
とか思いましたが実はあんまり気にしていませんでした。
なんせ自分の担当があるので、それ以外のことは運営スタッフにおまかせ状態でした^^
 
第1会場 38人
第2会場 47人
第3会場 35人
計:120人
 
行きましたねー。100人超え。
私の担当は一番多い第2会場のAWSJでした。
しかもトップバッター。
 
f:id:koichi0814:20170226232614j:plain
 
とりあえずスクリーンの横に立って、やってる感出してみる。
 
f:id:koichi0814:20170226233037j:plain
 
ライブコーディング風に15分で簡単なサーバーレスなアプリ(呼び方あってるのかな?)を構築している動画を再生している所!
ライブコーディングだと緊張して打ち間違いや手順を間違えたり、パニックになったりするので、15分でサーバーレスなアプリを構築できるように何度も練習して動画にしたものを15分に編集しました(笑)
 
はじめてのAWSサーバーレスということで、業務で実際に使っている内容を簡単なサンプルで再現する事にしました。
作ったサンプルはフォームに生年月日を入力して送信すると年齢を返すというもので、こんな手順で作りました。

  1. S3 のバケットと CloudFront を作成
    CloudFront 経由でしか S3 に直接アクセスできないようにします
  2. Lambda に設定するロールを作成
    S3 にファイルを作成するのでフルアクセス権限を持ったロールを作成します
  3. Lambda を作成
    パラメータの生年月日から年齢を計算して、結果を S3 に JSON ファイルとして格納します
    ファイルを作成したあとは、結果の画面を表示するために Location を指定して転送します
  4. API Gateway を作成
    Lambda は JSON を受け取る前提になっているので、フォームで入力された生年月日をJSONマッピングして Lambda を呼び出します
    Location をヘッダーにマッピングして 302 として返すようにします
    API Gatewayを直接呼び出されないようにキーも設定しておきます
  5. API Gateway 呼び出す CloudFront を作成
    API Gateway の URL を CloudFront の呼び出し先として設定します
  6. S3にソースをアップロード
    フォームの Action に API の CloudFront の Domain Name を設定します
  7. 完成
    1.で作った CloudFront の Domain Name をブラウザに入力して動作確認を行います

手順を間違えずにスムーズにサーバーレスを構築するのって、しっかりと頭に入ってないと難しかったです。
でもたった15分でサーバーレスができちゃうんですよね〜。
 
動画なので間違えたりしないのですが、
「ここを〜」とか「ここで〜」とか自分のMacに話しかけちゃってダメな感じでした。。。
しかも他の2会場に繋いでいるのでMacから離れると音声が届かないので、ほとんど下を向いてしまっていたことに途中で気が付きました(笑)
 
f:id:koichi0814:20170227000724j:plain
f:id:koichi0814:20170227004810j:plain
 
ほっと一息、質問コーナー。
 
Q1.
苦労した所はどこですか?
 
A1.
コンテンツの作成は専門の会社にお願いしていたのですが、一部に PHP が使われていたり、ヘッダーやフッターに SSI が使われていたので困りました。
S3 に置くので PHP は使えないし、SSI も動きません。PHP は止めてもらって、というか無視して、SSI についてはローカル環境に Xampp をインストールしてそこにソースを置いて wget で SSI が展開された html を取ってきて S3 にアップロードするという事をやっていました。
共通部分に修正が入るたびに全ソース修正するのが段々大変になってきたので、共通部分は JSON に持たしてページを開いたときに JavaScriptJSON からタグを生成するように変更しました。
 
Q2.
S3に置くようにしてサイトのリニューアル前と後ではパフォーマンスは良くなりましたか?
 
A2.
はい。かなりサクサク動くようになりました。
 
 
 

さいごに

スライドというか動画は300MBもあるのでどうやって公開しようか考え中です。。
言うの忘れていましたが、弊社ではクラウドエンジニアを絶賛募集中です!!