Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
CDKでAppSyncのJavaScriptリゾルバを開発したい
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
ryome
July 07, 2023
Technology
320
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
53
AWS MCPを使ってみた
ryome
0
640
ClineでAWS CDKやインフラ構成図作ってみた
ryome
1
650
PlaywrightというE2Eテストツールを布教したい
ryome
0
100
Cursorという最強エディタを使いこなしたい
ryome
0
360
E2Eテストを自動化したい
ryome
0
100
AWS CodeBuildを高速化したい
ryome
0
730
Cognitoの複数IDP認証でユーザを統合したい
ryome
1
1.5k
OAuth2.0完全に理解した
ryome
0
320
Other Decks in Technology
See All in Technology
20260929_AmazonGuardDutyの検出通知メールにAWS DevOpsAgentの調査結果を追加する
yhana
1
390
AI駆動開発で仕様はどこまで書くべきか? ― 人とAIの責務境界から考える開発プロセスの実践
takahiromatsui
1
270
顧客の成果創出とプロダクトの成長を 両立するためのFDE
sansantech
PRO
0
550
【ゲームメーカーズスクランブル2026】『Shadowverse: Worlds Beyond』UIとアニメーションで実現する最高のユーザー体験を叶えるプロトタイピング
cygames
PRO
1
710
AI感のないAWS構成図をAIエージェントに描かせたい!
sagochiko
2
480
Harness Engineering on Rails
joelq
0
770
AIに会社の文脈を理解させる技術~上流工程・非エンジニアにも広げるハーネスエンジニアリング実践~
ochtum
0
200
キャリアLT今日までそして明日から
kentapapa
1
140
可視化から始めたAI駆動開発_ochi_ver1.01 / AI-Driven Development Starting with Visualization_ver1.01
yayoi_dd
0
110
Confitura 2026
logico_jp
0
120
TiDBファミリーにDWHが新登場!! TiDB最新情報 / TiDB update 202609
yoshiakiyamasaki
0
170
Amazon Bedrock Agents ClassicからAmazon Bedrock AgentCoreへ移行した際、ガードレール設定が2箇所に割れた話
matsunobu
0
160
Featured
See All Featured
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
My Coaching Mixtape
mlcsv
0
330
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
470
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
320
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
290
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
290
Why You Should Never Use an ORM
jnunemaker
PRO
61
10k
Public Speaking Without Barfing On Your Shoes - THAT 2023
reverentgeek
1
580
Collaborative Software Design: How to facilitate domain modelling decisions
baasie
1
330
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Music & Morning Musume
bryan
48
7.4k
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.8k
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