Serverless　チュートリアル - lifeisegg2k/Study GitHub Wiki

はじめに

チュートリアルをやってみましょう

AWSアカウントが無ければ無料枠のアカウントを作成可能です。 AWS アカウント作成の流れを参考して、AWSのアカウントを作りましょ

サインイン

IAM User作成

  1. AWS マネジメントコンソールから「IAM」選択
  2. ユーザー選択

    Screen Shot 2020-02-23 at 17 49 33
  3. ユーザーを追加
    Screen Shot 2020-02-23 at 17 50 31
  4. ユーザー名とプラグラムによるアクセスをチェックし、次のステップ
    Screen Shot 2020-02-23 at 17 51 27
  5. 既存のポリシーを直接アタッチを選択、「AdministratorAccess」を選択し、次のステップ
    Screen Shot 2020-02-23 at 17 52 13
  6. 次のステップ
    Screen Shot 2020-02-23 at 17 52 38
  7. 確認画面で、ユーザーの作成
    Screen Shot 2020-02-23 at 17 52 57
  8. 作成された、ユーザー「Admin」のアクセスキーIDとシークレットアクセスキーを別途にコピーして置いて、閉じる
    Screen Shot 2020-02-23 at 17 53 22
  9. 作成された、ユーザー一覧
    Screen Shot 2020-02-23 at 17 53 50

AWS コマンドラインインターフェイス設置

AWS コマンドラインインターフェース (CLI) は、AWS サービスを管理するための統合ツールです。ダウンロードおよび設定用の単一のツールのみを使用して、コマンドラインから複数の AWS サービスを制御し、スクリプトを使用してこれらを自動化することができます。 AWS Cli インストールガイドを見ながら、自分の環境に合った方法でインストールする

設置後、AWS CLI の設定を行う。 aws configureを実行して、先コビーして置いたキーをあわせて入力する

$ aws configure
AWS Access Key ID : A****************
AWS Secret Access Key : 8Y******************************E
Default region name [None]:
Default output format [None]:

DynamoDB 作成

  1. AWS マネジメントコンソールからデータベースにある「DynamoDB」を選択
    Screen Shot 2020-02-23 at 18 38 49
  2. テーブル作成を選択
    Screen Shot 2020-02-23 at 18 39 30
  3. テーブル名に「notes」プライマリキーに「userId」ソートキー選択して、「noteId」入力
    Screen Shot 2020-02-23 at 18 42 43
  4. テーブル設定で、「デフォルト設定」を使用の選択を外すて、読み込み/書き込みキャパシティーモードで、「オンデマンド」選択
    Screen Shot 2020-02-23 at 18 43 25
  5. 保管時の暗号化を「デフォルト」を選択して、作成
    Screen Shot 2020-02-23 at 18 43 58
  6. DynamoDBのテーブル作成が完了
    Screen Shot 2020-02-23 at 18 46 01

S3 Bucket生成

Amazon S3（Simple Storage Service）は、RESTなどのWebサービスインターフェースを介してストレージサービスを提供しています。画像、ビデオ、ファイルなどを含むすべてのオブジェクトをS3に保存することができます。オブジェクトは、バケットで構成され、独自のカスタムキー各バケット内で識別されます。

  1. AWS マネジメントコンソールから「S3」選択
    Screen Shot 2020-02-23 at 19 23 03
  2. パケット作成を選択
    Screen Shot 2020-02-23 at 19 26 57
  3. パケット名「test-upload-app」を入力して、リージョンを選択した後、次へ
    Screen Shot 2020-02-23 at 19 33 07
  4. そのまま、次へ
    Screen Shot 2020-02-23 at 19 33 38
  5. そのまま、次へ
    Screen Shot 2020-02-23 at 19 35 19
  6. そのまま、パケットを作成
    Screen Shot 2020-02-23 at 19 35 54
  7. 作成した、パケットリストから「test-upload-app」を選択
    Screen Shot 2020-02-23 at 19 36 22
  8. アクセス権限のCORSの設定を順次選択＊
    Screen Shot 2020-02-23 at 19 37 26
  9. 以下のコードを入力後、「保存」
    <CORSConfiguration>
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
    Screen Shot 2020-02-23 at 19 38 10
  • CORS(Cross-Origin Resource Sharing)

別オリジンのリソースへアクセス(＝ クロスサイトHTTPリクエスト)できるようにするためのルール、手法。 作成するノートアプリでは、ユーザーが作成したバケットにファイルをアップロードします。 また、アプリはカスタムドメインを介して提供されるため、アップロード中にドメイン間で通信します。 デフォルトでは、S3は別のドメインからのリソースへのアクセスを許可しません。 ただし、クロスオリジンリソース共有（CORS）は、1つのドメインにロードされたクライアントWebアプリケーションが別のドメインのリソースと対話する方法を定義します。 S3バケットのCORSを有効にしましょう。

Cognito User Pool作成

Amazon Cognitoユーザーのプールを使用して、開発者は、Webやモバイルアプリケーションの登録とログイン機能を簡単に追加することができます。ユーザーディレクトリを維持するための固有のIDプロバイダーの役割をします。ログインしているユーザーのための識別トークンのプロビジョニングは、もちろん、ユーザー登録とログインをサポートします。

  1. AWS マネジメントコンソールから「Cognito」選択
    Screen Shot 2020-02-23 at 20 02 10
  2. ユーザープールの作成
    Screen Shot 2020-02-23 at 20 02 26

1. ユーザープールの作成する
Screen Shot 2020-02-23 at 20 02 44
1. プール名「test-upload-app」を入力し、デフォルトを確認するを選択
Screen Shot 2020-02-23 at 20 04 04
1. ユーザー名属性を選択
Screen Shot 2020-02-23 at 20 04 56
1. Eメールアドレスおよび電話番号を選択、Eメールアドレスを許可を選択
Screen Shot 2020-02-23 at 20 05 38
1. 次のステップを選択
Screen Shot 2020-02-23 at 20 05 49
1. そのまま、左メニューの「確認」を選択
Screen Shot 2020-02-23 at 20 06 38
1. そのまま、下のプール作成を選択
Screen Shot 2020-02-23 at 20 07 09
1. プール作成され、プールID、プールARNが表示される
Screen Shot 2020-02-23 at 20 07 33
1. 左メニューのアプリクライアントを選択し、「アプリクライアントの追加」選択
Screen Shot 2020-02-23 at 20 08 34
1. アプリクライアント名「note-app」、クライアントシークレットを生成を外し、画面のように選択
Screen Shot 2020-02-23 at 20 11 18
1. アプリクライアントを生成を選択
Screen Shot 2020-02-23 at 20 11 38
1. アプリクライアントIDが生成される
Screen Shot 2020-02-23 at 20 13 31
1. 左メニューのドメイン名を選択し、ドメインのプレプレフィックス「notes-app」、使用可能かチェックを押して、更新更新の保存を選択
Screen Shot 2020-02-23 at 20 14 32
1. 設定完了
Screen Shot 2020-02-23 at 20 15 27
⚠️ **GitHub.com Fallback** ⚠️