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
CDKでAppSyncのJavaScriptリゾルバを開発したい
Search
ryome
July 07, 2023
Technology
310
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
CDKでAppSyncのJavaScriptリゾルバを開発したい
CDKを使用してAppSyncのJavaScriptリゾルバを開発するメリットについて解説します。
ryome
July 07, 2023
More Decks by ryome
See All by ryome
AWSデスノート〜AWSの嫌いなところまとめ〜
ryome
0
45
AWS MCPを使ってみた
ryome
0
610
ClineでAWS CDKやインフラ構成図作ってみた
ryome
1
620
PlaywrightというE2Eテストツールを布教したい
ryome
0
88
Cursorという最強エディタを使いこなしたい
ryome
0
340
E2Eテストを自動化したい
ryome
0
92
AWS CodeBuildを高速化したい
ryome
0
700
Cognitoの複数IDP認証でユーザを統合したい
ryome
1
1.4k
OAuth2.0完全に理解した
ryome
0
280
Other Decks in Technology
See All in Technology
SRE Lounge Hiroshimaへの招待
grimoh
0
640
地域 SRE コミュニティ最前線 / SRE NEXT 2026 Discussion Night Track C
muziyoshiz
0
220
ポストモーテム! DDoSからサイトは守れた。 でもビジネスは守れなかった。
bengo4com
1
2.9k
Oracle Exadata Database Service on Cloud@Customer X11M (ExaDB-C@C) サービス概要
oracle4engineer
PRO
2
8.4k
環境凍結という Toil を倒す -セルフサービス型 Ephemeral テスト環境の 設計と実践
shirouz
1
2.3k
オブザーバビリティ、本当に活用できてる? 〜API連携×生成AIで成熟度を自動評価〜
dmmsre
1
3.1k
インフラ寄りSREでも 開発に踏み出せる〜境界を越えてユーザー体験に向き合いたい〜
sansantech
PRO
2
3.8k
kintone の AI コワーカーを、 Anthropic にエージェントを"ホストさせて"作った話 #devkinmeetup
sugimomoto
0
100
Devsumi 2026 Summer 人もAIも使える共通基盤を事業の加速装置にする~デザインシステム運用に学ぶ組織レバレッジ~ 渡辺 凌央
legalontechnologies
PRO
0
120
人を動かすのは時間ではなく、納得感 〜新任EMが入社3ヶ月、組織を2回変えた話〜
kakehashi
PRO
3
220
AI Driven AI Governance
pict3
0
370
あなたの『Site』はどこですか? — xREという考え方
miyamu
0
1.2k
Featured
See All Featured
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Large-scale JavaScript Application Architecture
addyosmani
515
110k
Mind Mapping
helmedeiros
PRO
1
280
Exploring anti-patterns in Rails
aemeredith
3
440
End of SEO as We Know It (SMX Advanced Version)
ipullrank
3
4.3k
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
akademiya2063
PRO
1
170
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
37
6.5k
My Coaching Mixtape
mlcsv
0
170
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
220
Code Reviewing Like a Champion
maltzj
528
40k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
6k
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.4k
Transcript
CDKでAppSyncの JavaScriptリゾルバを開発したい
AWS CDKおさらい • AWS CDKは、クラウドリソースのプロビジョニングを行うための 開発フレームワーク • AWS CDKを使うと、開発者は一般的なプログラミング言語を使用して、 クラウドリソースをプロビジョニングすることができる
• AWS CDKは、AWSリソースの高レベルな抽象化を提供し、開発者は インフラの詳細を深く理解しなくても、クラウドリソースの作成、 管理をすることができる • AWS CDKはAWS CloudFormationを内部的に使用して、 クラウドリソースをプロビジョニングする
AWS AppSyncおさらい • AWS AppSyncは、AWSが提供するフルマネージド型のGraphQLサービス • AWS AppSyncは、GraphQLのsubscription機能を使用して、 リアルタイムなデータ同期を可能にする •
AWS AppSyncは、Amazon DynamoDB、Amazon Auroraなどの異なる データソースからデータを取得し、単一のAPIエンドポイントで結合が可能 • GraphQLを採用しているため、AppSyncではクライアントが必要な データのみをクエリーすることができる
AppSyncリゾルバおさらい • AppSync では、データソース、リゾルバ、関数を定義することができる • リゾルバは AppSync に GraphQL リクエストの処理方法を指示し、
レスポンスを GraphQL タイプで返却する • AppSync のリゾルバは、パイプラインで最大10個の関数を設定でき、 それぞれがデータソースに接続できる • リゾルバが呼び出されると、各関数が順番に実行される GraphQL リ ク エ ス ト パ イ プ ラ イ ン リ ク エ ス ト 関 数 リ ク エ ス ト デ ー タ ソ ー ス 関 数 レ ス ポ ン ス パ イ プ ラ イ ン レ ス ポ ン ス GraphQL レ ス ポ ン ス ・・・
なぜ、CDKでAppSync開発?? • 共通言語利用:JavaScriptさえ習得すればインフラ、フロントエンド、バック エンドのコードが書ける(インフラに条件分岐・ループ等も使用可能) • 自動デプロイ:cdk watchコマンドを使用して、変更があった際に 自動的に検知してデプロイができる(cdk.jsonにwatch範囲を定義する) • コード短縮:CloudFormationテンプレートが数千行必要となるような
複雑なインフラを数百行程度のコードで実現できる • 静的な型チェックと自動補完:インフラ開発の初期段階で、 エラー検出が可能になり、IDEの自動補完機能をフル活用できる
共通言語利用 フロントエンド (React) バックエンド (AppSync) インフラ (CDK)
自動デプロイ ① 「 cdk watch --hotswap-fallback 」 コマンドを実行 ② 変更を自動検知して
デプロイを実行する
コード短縮 CDK CloudFormation 153行 909行
静的な型チェックと自動補完 IDEが自動補完 してくれる 引数の型が 決まっている
JavaScriptリゾルバによりVTLから解放 VTLのダメだったところ • 学習難易度:学習コストが高い かつ 他で使う場面が少ない • ドキュメント不足:VTLに関する記事が少ない JavaScriptになって良かったこと •
共通言語利用:JavaScriptさえ習得すればフロントエンドも バックエンドも書ける • ドキュメントが豊富: JavaScriptに関する記事は多い
機能一覧・インフラ構成図 ToDoリストアプリ • ログイン機能 • タスク一覧機能 • タスク作成機能 • タスク完了機能
• タスク削除機能 ソースコード等は以下に格納されています。 https://github.com/ryomeblog/cdk-js-resolvers-sample
シーケンス図 (初回起動・ログイン)
シーケンス図 (タスク作成)
シーケンス図 (タスク完了)
シーケンス図 (タスク削除)
動作確認 詳細はQiitaで解説。 https://github.com/ryomebl og/cdk-js-resolvers-sample
参考文献 • https://github.com/ryomeblog/cdk-js-resolvers-sample • https://dev.classmethod.jp/articles/cdk-watch-mode • https://cdkworkshop.com/ja/20-typescript/30-hello- cdk/300-cdk-watch.html