category / AWS

AWS

【AWS】フォームで送信したユーザー情報を、Amazon Cognitoでユーザー認証する

前回は、Amazon Cognito から送られてきた確認コードを確認済みにしました。 今回は、フォームで送信したユーザー情報を、Amazon Cognito でユーザー認証します。 まずは、Login.jsx…

続きを読む
2022年01月31日3 分
AWS

【AWS】Amazon Cognitoの確認コード用のフォームを作成する

前回は、Amazon Cognito を AWS Amplify を使わずに連携し、Emal とパスワードを登録しました。 今回は、Amazon Cognito…

続きを読む
2022年01月30日1 分
AWS

【AWS】フロントエンドで送信したデータをAmazon Cognitoに登録する

前回は、Amazon Cognito のユーザープールを作成しました。 今回は、Amazon Cognito を AWS Amplify を使わずに連携し、Emal とパスワードを登録します。 テスト用のフォームを React で簡単に作成しました。 まずは、amazon…

続きを読む
2022年01月29日3 分
AWS

【AWS】Amazon Cognitoのユーザープールを作成する

前回は、Amazon API Gateway で Amazon DynamoDB の単一データを削除しました。 今回は、Amazon Cognito のユーザープールを作成します。 AWS コンソールで、cognito…

続きを読む
2022年01月28日1 分
AWS

【AWS】Amazon API GatewayでAmazon DynamoDBの単一データを削除する

前回は、Amazon API Gateway で Amazon DynamoDB の単一データを取得しました。 今回は、Amazon DynamoDB の単一データを削除します。 まずは、AWS Lambda サービスにアクセスします。 bookDelete…

続きを読む
2022年01月27日1 分
AWS

【AWS】Amazon API GatewayでAmazon DynamoDBの単一データを取得する

前回は、Amazon API Gateway で Amazon DynamoDB のデータを取得しました。 今回は、Amazon DynamoDB の単一データを取得します。 まずは、AWS Lambda サービスにアクセスします。 bookGet…

続きを読む
2022年01月26日1 分
AWS

【AWS】Amazon API GatewayでAmazon DynamoDBのデータを取得する

前回は、Amazon API Gateway で送信したデータを Amazon DynamoDB に保存しました。 今回は、Amazon DynamoDB のデータを取得します。 まずは、AWS Lambda サービスにアクセスします。 bookGets…

続きを読む
2022年01月24日2 分
AWS

【AWS】Amazon API Gatewayで送信したデータをAmazon DynamoDBに保存する

前回は、AWS Lambda と Amazon DynamoDB を連携しました。 今回は、Amazon API Gateway で送信したデータを Amazon DynamoDB に保存します。 まずは、Amazon API Gateway にアクセスします。 作成した、API…

続きを読む
2022年01月23日1 分
AWS

【AWS】AWS ALambdaとAmazon DynamoDBを連携する

前回は、Amazon DynamoDB でテーブルを作成しました。 今回は、AWS Lambda と Amazon DynamoDB を連携します。 まずは、AWS Lambda サービスにアクセスします。 bookCreate(POST…

続きを読む
2022年01月22日1 分
AWS

【AWS】Amazon DynamoDBでテーブルを一から作成する

前回は、Amazon API Gateway で ET メソッドを作成しました。 今回は、Amazon DynamoDB でテーブルを作成します。 まずは、Amazon DynamoDB…

続きを読む
2022年01月21日1 分
AWS

【AWS】Amazon API GatewayでGETメソッドを作成する

前回は、Amazon API Gateway で DELETE メソッドを作成しました。 今回は、GET メソッドを作成します。 まずは、AWS コンソールで、API Gateway を開きます。 今回作成している API Gateway を開きます。 単一の GET…

続きを読む
2022年01月20日1 分
AWS

【AWS】Amazon API GatewayでDELETEメソッドを作成する

前回は、Amazon API Gateway でレスポンスデータを修正しました。 今回は、DELETE メソッドを作成します。 まずは、AWS コンソールで、API Gateway を開きます。 今回作成している API Gateway…

続きを読む
2022年01月19日2 分
AWS

【AWS】Amazon API Gatewayでレスポンスデータを修正する

前回は、Amazon API Gateway で JSON オブジェクトを送信しました。 今回は、レスポンスデータを修正します。 まずは、AWS コンソールで、API Gateway を開きます。 今回作成している API Gateway を開きます。 リソースの POST…

続きを読む
2022年01月18日1 分
AWS

【AWS】Amazon API GatewayでJSONオブジェクトを送信する

前回は、AWSLambda を作成し、Amazon API Gateway と連携しました。 今回は、JSON オブジェクトを送信します。 まずは、AWS コンソールで、API Gateway を開きます。 今回作成している API Gateway を開きます。 Content…

続きを読む
2022年01月17日2 分
AWS

【AWS】Amazon API GatewayとAWSLambdaを連携する

前回は、Amazon API Gateway で POST メソッドを作成しました。 今回は、AWSLambda を作成し、Amazon API Gateway と連携します。 まずは、AWS コンソールで AWS Lambda…

続きを読む
2022年01月16日1 分
AWS

【AWS】Amazon API Gatewayを一から構築する

Amazon API Gateway を一から構築していきます。 今回は、POST メソッドを作成します。 まずは、AWS のコンソールで、API Gateway に移動します。 API タイプを選択から、REST API の『構築』をクリックします。 プロトコルは、『REST…

続きを読む
2022年01月15日1 分
AWS

【AWS】AWS Fargate for Amazon ECSを使ってコンテナを作成する 後編

前回は、AWS Fargate for Amazon ECS を使ってコンテナを作成するにあたって、クラスターを作成するところまでいきました。 今回は、前回の続きからスタートします。 AWS コンソールの検索画面で、Elastic Container Service…

続きを読む
2022年01月13日12 分
AWS

【AWS】AWS Fargate for Amazon ECSを使ってコンテナを作成する 前編

AWS Fargate for Amazon ECS を使って、コンテナを作成します。 AWS Hands-On Series の『はじめてのコンテナ』を基に、進めていきます。 ※途中、AWS Hands-On Series…

続きを読む
2022年01月12日10 分
AWS

【AWS】サーバーレスオフラインでDynamoDBのデータを更新する

前回は、サーバーレスオフラインで DynamoDB のデータを削除しました。 今回は、DynamoDB のデータを更新します。 まずは、更新するためのハンドラーを作成します。 api フォルダに、update-note.js を作成します。 create-note.js…

続きを読む
2022年01月01日2 分
AWS

【AWS】サーバーレスオフラインでDynamoDBのデータを削除する

前回は、サーバーレスオフラインで DynamoDB に保存した単一データを取得しました。 今回は、DynamoDB のデータを削除します。 まずは、ハンドラーを作成します。 api フォルダに、delete-note.js を作成します。 get-notes.js…

続きを読む
2021年12月31日2 分
AWS

【AWS】サーバーレスオフラインでDynamoDBに保存した単一データを取得する

前回は、サーバーレスオフラインで DynamoDB に保存したデータを取得しました。 今回は、保存したデータから、単一データを取得します。 まずは、単一データを取得するためのハンドラーを作成します。 api フォルダに、get-note.js を作成します。 get-notes…

続きを読む
2021年12月30日2 分
AWS

【AWS】サーバーレスオフラインでDynamoDBに保存したデータを取得する

前回は、サーバーレスオフラインで DynamoDB にデータを保存しました。 今回は、DynamoDB に保存したデータを取得します。 まずは、データを取得するためにハンドラーを作成します。 api フォルダに、get-notes.js を作成します。 前回作成した、create…

続きを読む
2021年12月29日3 分
AWS

【AWS】サーバーレスオフラインでDynamoDBにデータを保存する

前回は、サーバーレスのテンプレートに DynamoDB を接続しました。 今回は、サーバーレスオフラインを使って、DynamoDB にデータを保存します。 まずは、api フォルダを作成し、create-note.js を作成します。 aws-sdk…

続きを読む
2021年12月28日5 分
AWS

【AWS】サーバーレスのテンプレートとDynamoDBを接続する

前回は、サーバーレスのテンプレートを作成しました。 今回は、作成したテンプレートに DynamoDB を接続します。 DynamoDB を設定するために、serverless.yml を開きます。 まずは、テーブル名を設定します。 provider…

続きを読む
2021年12月27日2 分
AWS

【AWS】サーバーレスのテンプレートを作成する

今回は、サーバーレスフレームワークを実装します。 まずは、ターミナルで  npm install -g serverless を実行します。 ターミナルで作成したいプロジェクトのディレクトを作成します。 先程作成したディレクトリへ移動します。 ターミナルで、 npx sls…

続きを読む
2021年12月26日1 分
AWS

【AWS】Alexa(アレクサ)にメッセージを伝えるテストをする

今日はクリスマスなので、Alexa に子供に向けてメッセージを話させたいと考えています。 メッセージには、固有名詞が入るのでアプリとして配信できません。 テストのみになります。 今回は、Alexa のシミュレータを使って、Alexa と会話します。 まずは、Amazon…

続きを読む
2021年12月25日5 分
AWS

【AWS】AWS CDKに認証機能を追加する

前回は、Amazon API Gateway と Cognito を連携しました。 今回は、以前作成した AWS CDK に、認証機能を追加します。 以前作成した AWS CDK は、こちらです。 まずは、Amazon API Gateway…

続きを読む
2021年12月24日2 分
AWS

【AWS】Amazon API GatewayとCognitoを連携する

前回は、Amazon Congnito で認証の設定をしました。 今回は、設定した認証を、Amazon API Gateway と連携します。 まずは、 Amazon API Gateway にアクセスします。 AWS CDK で作成した API…

続きを読む
2021年12月23日3 分
AWS

【AWS】Amazon Cognitoで認証の設定をする

Amazon Cognito は、認証を素早く安全に構築してくれます。 まずは、AWS マネジメンドコンソールで、cognito を検索します。 サービスに Cognito…

続きを読む
2021年12月22日3 分
AWS

【AWS】AWS Cloud Development Kit(AWS CDK)でAWS Lambdaのデプロイを設定する

前回は、AWS CDK で hello のデータを DynamoDB に接続しました。 今回は、AWS Lambda のデプロイを設定します。 AWS Lambda をデプロイするには、依存関係を一つにまとめる必要があります。 また、AWS CDK では TypeScript…

続きを読む
2021年12月21日1 分
AWS

【AWS】AWS Cloud Development Kit(AWS CDK)でDynamoDBに接続する

前回は、ゼロから AWS CDK を構築しました。 今回は、hello のデータを DynamoDB に接続します。 まずは、lib フォルダの cdk-stack.ts を開きます。 aws-cdk-lib から aws_apigateway をインポートします。 aws…

続きを読む
2021年12月20日2 分
AWS

【AWS】AWS Cloud Development Kit(AWS CDK)をゼロから構築する

前回までは、ワークショップを基に AWS CDK を作成しました。 今回は、ゼロから AWS CDK を構築します。 まずは、プロジェクトのフォルダを作成します。 ターミナルで、プロジェクトのディレクトリに移動し、npm init -y  を実行します。 package.json…

続きを読む
2021年12月19日5 分
AWS

【AWS】AWS Cloud Development Kit(AWS CDK)でカウントした回数をブラウザに表示する

前回は、AWS CDK で URL の接続回数をカウントするアプリを作成しました。 今回は、テストで作成しているアプリを修正し、テーブルとしてブラウザに表示させます。 テーブルをブラウザに表示させる cdk-dynamo-table-viewer  をインポートします。 ※cdk…

続きを読む
2021年12月18日3 分
AWS

【AWS】AWS Cloud Development Kit(AWS CDK)でURLの接続回数をカウントするアプリを作成する

前回は、AWS Cloud Development Kit(AWS CDK)で関数を作成しました。 今回は、URL の接続回数をカウントするアプリを作成します。 ワークショップに習って、URL…

続きを読む
2021年12月17日7 分
AWS

【AWS】AWS Cloud Development Kit(AWS CDK)で関数を作成する

前回は、AWS Cloud Development Kit(AWS CDK)で新しいプロジェクトを作成しました。 今回は、関数を作成し、テストします。 lib フォルダの test-aws-cdk-stack.ts…

続きを読む
2021年12月16日3 分
AWS

【AWS】AWS Cloud Development Kit(AWS CDK)で新しいプロジェクトを作成する

AWS 公式サイト( https://aws.amazon.com/jp/cdk/#:~:text=AWS Cloud Development Kit )によると、AWS Cloud Development Kit(AWS CDK…

続きを読む
2021年12月15日2 分
AWS

【AWS】AWS Amplify StudioでFigmaのデザインを基に作成したReactを修正する

前回は、AWS Amplify Studio で Figma のデザインを基に、React を作成しました。 今回は、プロジェクトを修正します。 React にコンポーネントを追加する まずは、React にコンポーネントを追加して、ウェブサイトらしく見せます。 Figma…

続きを読む
2021年12月14日6 分
AWS

【AWS】AWS Amplify StudioでFigmaのデザインを基に、Reactを作成する

AWS Amplify Studio を使うと、Figma のデザインを基に、ほぼコードを書かず、自動で React を作成してくれます。 Figma のデザインを作成する。 Figma のデザインを作成するには、Figma のコミュニティ( https://www.figma…

続きを読む
2021年12月13日5 分
AWS

【AWS】AWS Amplifyでデプロイする

前回は、AWS Amplify で認証を追加しました。 今回は、開発したプロジェクトを AWS Amplify でデプロイします。 ホーム画面に読書リストが来るよう、開発していたプロジェクトを修正します。 また、Signin や Signup も AWS…

続きを読む
2021年12月12日2 分
AWS

【AWS】AWS Amplifyで認証を追加する

前回は、AWS Amplify でフロントエンドでデータ一覧の画面表示、作成、削除、更新しました。 今回は、AWS Amplify でアカウント作成やログイン認証機能を追加します。 まずは、フロントエンドのプロジェクトのディレクトリに進みます。 ターミナルで、 amplify…

続きを読む
2021年12月11日3 分
AWS

【AWS】AWS Amplifyを使い、フロントエンドでデータの一覧表示、作成、削除、更新する

前回は、AWS AppSync を、フロントエンドと統合しました。 今回は、フロントエンドでデータ一覧の画面表示、作成、削除、更新します。 GraphQL で取得したデータ一覧を画面に表示する まずは、ブラウザに GraphQL…

続きを読む
2021年12月10日12 分
AWS

【AWS】AWS AppSyncを、フロントエンドと統合する

前回は、AWS Amplify を、フロントエンドと統合しました。 今回は、AWS Appsync を、フロントエンドと統合します。 まずは、amplify/api/awsgraphqltest フォルダにある、schema.graphql を開きます。 Book…

続きを読む
2021年12月09日5 分
AWS

【AWS】AWS Amplifyを、フロントエンドと統合する

前回は、AWS AppSync で新しいデータテーブルを作成しました。 今回は、AWS Amplify を、フロントエンドと統合します。 フロントエンドは、以前作成した React を使用します。 https://codesandbox.io/s/20211126-graphql…

続きを読む
2021年12月08日3 分
AWS

【AWS】AWS AppSyncで、新しいデータテーブルを作成する

前回は、AWS AppSync で API を削除、更新しました。 今回は、新しいデータテーブルを作成します。 まずは、AWS AppSync…

続きを読む
2021年12月07日3 分
AWS

【AWS】AWS AppSyncで、APIを削除、更新する

前回は、AWS AppSyncでAPIを作成しました。 今回は、AWS AppSyncでAPIを削除、更新します。 APIデータを追加する 現在、DynamoDBには、Categoryテーブルにデータが1件入っています。 データを削除するため、もう1件追加しましょう。 AWS…

続きを読む
2021年12月06日3 分
AWS

【AWS】AWS AppSyncで、APIを作成する

今回は、AWS App Syncを使って、APIを作成します。 AWS AppSyncを使うことで、GraphQLのAPIの開発ができるようになります。 まずは、AWS https://aws.amazon.com/jp/ にログインし、AWS…

続きを読む
2021年12月05日3 分
AWS

【AWS】AWS Amplifyに登録する

今回は、AWS Amplifyを設定する方法を紹介します。 公式サイトによると、AWS Amplifyとは、スケーラブルなモバイルアプリケーションとウェブアプリケーションを無限の柔軟性ですばやく構築する、と書かれています。 AWS Amplify…

続きを読む
2021年12月04日3 分