Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
第166回 雲勉 コードを読んで理解する AWS Amplify Gen2 Backend
Search
iret.kumoben
June 26, 2025
Technology
0
61
第166回 雲勉 コードを読んで理解する AWS Amplify Gen2 Backend
下記、勉強会での資料です。
https://youtu.be/txpkVWWXzFY
iret.kumoben
June 26, 2025
Tweet
Share
More Decks by iret.kumoben
See All by iret.kumoben
第177回 雲勉 IdP 移行を楽に!Amazon Cognito でアプリへの影響をゼロにするアイデア
iret
0
28
第176回 雲勉 VPC 間サービス接続を考える!Private Service Connect 入門
iret
0
32
第175回 雲勉 Amazon ECS入門:コンテナ実行の基本を学ぶ
iret
0
45
第174回 雲勉 Google Agentspace × ADK Vertex AI Agent Engineにデプロイしたエージェントを呼び出す
iret
0
73
第173回 雲勉 ノーコードで生成 AI アプリを構築!Google Cloud AI Applications(旧 Vertex AI Agent Builder)入門
iret
0
64
第170回 雲勉 Lyria が切り拓く音楽制作の未来
iret
1
40
第169回 雲勉 AWS WAF 構築 RTA
iret
0
47
第168回 雲勉 JITNAの使い方とハマったポイントについて語る回
iret
0
52
第167回 雲勉 エージェント開発を加速する Agent Development Kit 入門
iret
1
62
Other Decks in Technology
See All in Technology
SRE × マネジメントレイヤーが挑戦した組織・会社のオブザーバビリティ改革 ― ビジネス価値と信頼性を両立するリアルな挑戦
coconala_engineer
0
200
AWS DMS で SQL Server を移行してみた/aws-dms-sql-server-migration
emiki
0
220
GraphRAG グラフDBを使ったLLM生成(自作漫画DBを用いた具体例を用いて)
seaturt1e
1
140
マルチエージェントのチームビルディング_2025-10-25
shinoyamada
0
150
オブザーバビリティが育むシステム理解と好奇心
maruloop
2
1k
SOTA競争から人間を超える画像認識へ
shinya7y
0
220
もう外には出ない。より快適なフルリモート環境を目指して
mottyzzz
13
10k
アウトプットから始めるOSSコントリビューション 〜eslint-plugin-vueの場合〜 #vuefes
bengo4com
3
1.8k
AI時代、“平均値”ではいられない
uhyo
8
2.5k
SCONE - 動画配信の帯域を最適化する新プロトコル
kazuho
1
370
混合雲環境整合異質工作流程工具運行關鍵業務 Job 的經驗分享
yaosiang
0
180
OpenTelemetry が拡げる Gemini CLI の可観測性
phaya72
2
2.2k
Featured
See All Featured
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
Unsuck your backbone
ammeep
671
58k
Speed Design
sergeychernyshev
32
1.2k
Designing for Performance
lara
610
69k
Reflections from 52 weeks, 52 projects
jeffersonlam
353
21k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
253
22k
Making Projects Easy
brettharned
120
6.4k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.7k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
127
54k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.7k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.7k
Into the Great Unknown - MozCon
thekraken
40
2.1k
Transcript
第166回 雲勉 コードを読んで理解する AWS Amplify Gen 2 Backend
0. 講師自己紹介 2 • 本田 岳士(ほんだ たけし) • クラウドインテグレーション事業部ソリューション開発セクション第2開発グループ (大阪オフィス)
• 40歳からエンジニア(5年目)、自社開発2社経験してアイレット • アイレット歴 もうすぐ丸2年 • スパゲッティコードに対する耐性が強み • 趣味は一人旅、変なTシャツ・パーカー、猫3匹 • 推しのAWSサービスはAWS CDK
アジェンダ 3 0. 自己紹介 1. AWS Amplify Gen 2とは 2.
defineBackendによるリソース作成 3. defineAuthで作成される認証機能 4. defineDataで定義されるGraphQLサービスとDB 5. AWS CDKでリソースを定義する 6. まとめ
1. AWS Amplify Gen 2とは 4
1.AWS Amplify Gen 2とは 5 ◼ AWS Amplify Gen 2(以下Amplify
Gen 2)とは • フロントエンドエンジニアであってもTypeScriptベースでフロントエンド/バックエンドのフ ルスタック開発を可能にするプラットフォームです。 • ReactやVue.js、Next.jsなどのJavaScriptフレームワーク開発、React NativeやFlutterなど のモバイルアプリ開発のテンプレートが提供されています。 • 開発者ごとに独立したサンドボックス環境を用意することができ、お互いのリソースに影響を 与えることなく並行して開発することが可能になっています。 • Gitのブランチに対応した本番/ステージング環境を自動でデプロイできます。 • ビルド、デプロイ、データなどを単一のコンソールで一元管理できます。
1. AWS Amplify Gen 2とは 6 • バックエンドの定義を行っているのは amplify/backend.tsです。 •
初期状態はとてもシンプルですが、この コードによって行われる処理についてお話 したいと思います。
2. defineBackendによるリソース作成 7
2. defineBackendによるリソース作成 8 8 2025年5月現在、defineBackendで渡すことができる引数は以下の4種類です。 1. authリソース (Amazon Cognito) →
defineAuth 2. dataリソース (AWS AppSync, Amazon DynamoDB) → defineData 3. storageリソース (Amazon S3) → defineStorage 4. functionリソース (AWS Lambda) → defineFunction (3と4は初期状態で定義されていない) 3と4は複数指定可 (1と2はシングルトンパターンに従う) 引数がどのリソースか判別するforEachと インスタンスを作成するforEach
2. defineBackendによるリソース作成 9 9 戻り値はオブジェクトで、引数で渡したそれぞれのリソース名のオブジェクト(コン ストラクト) のプロパティとCDKスタック(Stackクラスのインスタンス)である stackプロパティが含まれます。 また、オブジェクトメソッドとして 1.
createStack(別のスタックを作成) 2. addOutput(出力の設定) が用意されます。 @aws-amplify/backend/lib/backend_factory.jsでdefineBackendが定義されて います。
3. defineAuthで作成される認証機能 10
3. defineAuthで作成される認証機能 11 defineAuthではAmazon CognitoのUserPoolを作成します。 初期状態ではシンプルなメールアドレスのみの認証となっています。
3. defineAuthで作成される認証機能 1 2 12 型定義は以下の通りです。loginWithで複数項目を指定した際はOr条件です。 externalProvidersでSNS認証やSAML認証などの設定を行うことができます。 詳しくは概要欄のリンクを参考にしてください。 @aws-amplify/backend-data/lib/types.d.ts
3. defineAuthで作成される認証機能 13 UserAttributesで指定できる標準属性は左下の通りです。 (@aws-amplify/auth-construct/lib/types.d.ts)それ以外はカスタム属性として定 義します。
4. defineDataで定義される GraphQLサービスとDB 14
4. defineDataで定義されるGraphQLサービスとDB 15 defineDataではGraphQLサービスとDBを作成します。 Gen 1ではバックエンドサービスとしてRestAPI(AWS API Gateway)とGraphQL が選択できたのですが、Gen 2ではGraphQLのみとなっています。
4. defineDataで定義されるGraphQLサービスとDB 16 型定義を確認するとschema(必須)、name、authorizationModes、functionsを指 定できることがわかります。schemaに関しては直接文字列で定義する方法と、初 期状態にあるa.schema…(DerivedModelSchema)で書く方法があります。 DerivedModelSchemaに関しては概要欄にある私のブログを参照してください。 @aws-amplify/backend-data/lib/types.d.ts
4. defineDataで定義されるGraphQLサービスとDB 17 スキーマでQuery、Mutation、Subscriptionも定義できます。リゾルバーもある程 度記述できます。 フィールドレベルのリゾルバーや 複雑なリゾルバーなど、CDKのみ の実装となることがあります。
4. defineDataで定義されるGraphQLサービスとDB 18 バックエンドで定義したスキーマはクライアントで使用できるように変換して TypeScriptの型として使うことができます。
4. defineDataで定義されるGraphQLサービスとDB 19 認可戦略について 用途 戦略 (schemaのallow.の後) クライアントのauthMode defineDataの authorizationMode
匿名ユーザーによる公開データアクセス publicApiKey apiKey apiKey 本番環境での公開データアクセス (未認証ユーザー) guest identityPool userPool/oidc ユーザーごとのデータアクセス (レコードの「所有者」に制限) owner/ownerDefinedIn/ownersDefinedIn userPool/oidc userPool/oidc サインイン済みユーザーによるデータアクセス authenticated userPool/oidc/identityPool userPool/oidc ユーザーグループごとのデータアクセス group/groupDefinedIn/groups/groupsDefinedIn userPool/oidc userPool/oidc サーバーレス関数内でのカスタム認可ルール custom lambda lambda
5. AWS CDKでリソースを定義する 20
5. AWS CDKでリソースを定義する 21 defineBackendで作成できないものに関してはAWS CDKで実装することになりま す。新しいスタックを作成してリソースを追加するのとdefineBackendで作成され るスタックにリソースを追加するのでは書き方が異なります。
6.まとめ 22
6. まとめ 23 • defineBackendで定義できるリソースは少ないですが、CDKで柔軟に拡張できる のでそこまで不自由を感じないと思います。 • そしてバックエンドで定義したスキーマを変換してそのままクライアントで使用 できるのは大変魅力だと感じました!
リファレンス 24 • フルスタック TypeScript 開発環境 AWS Amplify Gen 2
をグラレコで解説 https://aws.amazon.com/jp/builders-flash/202411/awsgeek-aws-amplify-gen2/ • Amplify Docs - Build & connect backend - https://docs.amplify.aws/react/build-a-backend/ • iret.media – AWS Amplify Gen 2におけるDerivedModelSchemaの完全ガイド - https://iret.media/153898
25 ご清聴ありがとうございました!