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
AWS AppSyncと仲良くするためのTips
Search
Haruna Oka
July 10, 2024
Technology
1
130
AWS AppSyncと仲良くするためのTips
Classmethod Odyssey Online 2024/07/09 に発表した「AWS AppSyncと仲良くするためのTips」のスライド#cm_odyssey
Haruna Oka
July 10, 2024
Tweet
Share
More Decks by Haruna Oka
See All by Haruna Oka
Next.js × AWS App Runner × AWS AppSyncで進めるクライアントファーストのWEB開発
okaharuna
7
5.5k
re:Growth 2020 Serverless
okaharuna
2
1.3k
EventBridgeでAWSとShopifyの統合
okaharuna
2
5.8k
Serverless SPA development starting with Angular
okaharuna
0
3.3k
serverlessdaysfukuoka_oka.pdf
okaharuna
1
2.1k
SPA×Auth0
okaharuna
5
2k
Fargate_Super_Introduction.pdf
okaharuna
2
3.1k
Other Decks in Technology
See All in Technology
データの品質が低いと何が困るのか
kzykmyzw
6
1.1k
「海外登壇」という 選択肢を与えるために 〜Gophers EX
logica0419
0
700
Moved to https://speakerdeck.com/toshihue/presales-engineer-career-bridging-tech-biz-ja
toshihue
2
730
急成長する企業で作った、エンジニアが輝ける制度/ 20250214 Rinto Ikenoue
shift_evolve
3
1.2k
【Developers Summit 2025】プロダクトエンジニアから学ぶ、 ユーザーにより高い価値を届ける技術
niwatakeru
2
1.3k
人はなぜISUCONに夢中になるのか
kakehashi
PRO
6
1.6k
30分でわかる『アジャイルデータモデリング』
hanon52_
9
2.6k
転生CISOサバイバル・ガイド / CISO Career Transition Survival Guide
kanny
3
960
The Future of SEO: The Impact of AI on Search
badams
0
180
クラウドサービス事業者におけるOSS
tagomoris
0
210
2024.02.19 W&B AIエージェントLT会 / AIエージェントが業務を代行するための計画と実行 / Algomatic 宮脇
smiyawaki0820
12
2.9k
管理者しか知らないOutlookの裏側のAIを覗く#AzureTravelers
hirotomotaguchi
2
330
Featured
See All Featured
How STYLIGHT went responsive
nonsquared
98
5.4k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
30
4.6k
Designing Experiences People Love
moore
140
23k
Fashionably flexible responsive web design (full day workshop)
malarkey
406
66k
Fontdeck: Realign not Redesign
paulrobertlloyd
83
5.4k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
Navigating Team Friction
lara
183
15k
For a Future-Friendly Web
brad_frost
176
9.5k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Measuring & Analyzing Core Web Vitals
bluesmoon
6
240
Transcript
AWS AppSyncと 仲良くするためのTips 2024.07.09 フリーランスエンジニア 岡 春奈
Xへの投稿の際は、 ハッシュタグ #cm_odyssey でお願いいたします。 2 お願い
⾃⼰紹介 3 岡 春奈 / Haruna Oka バックエンドエンジニア @OkaHaruna
本⽂タイトル • 話すこと ◦ 今使っている案件でのAppSyncの話 • 話さないこと ◦ フロントの話 ◦
Amplifyの話(Gen2) 4
全体構成 5
6
AppSyncを1年使ってみた 7
アジェンダ • 構成を変えたところ • それぞれの難点‧利点 • まとめ 8
構成を変えた部分 9
構成を変えた部分 • リゾルバーの使い分けを⾒直した • オニオンアーキテクチャの導⼊ • APIの認証⽅式を変えた • バリデーションスキーマを⾃動⽣成 10
リゾルバーの種類 • ユニットリゾルバー • パイプラインリゾルバー • Lambdaリゾルバー 11
ユニットリゾルバー 12 公式Docs: AWS AppSync リゾルバー
パイプラインリゾルバー 13 公式Docs: AWS AppSync リゾルバー
Lambdaリゾルバー 14 正確にはLambdaをデータソースとし たユニットリゾルバー 公式Docs: AWS AppSync リゾルバー
リゾルバーの使い分け 15
元々の使い分け 16
開発進める中での問題点 17
開発進める中での問題点 • JSリゾルバーの制約が⾟い ◦ 組み込み関数が多々使えない • Pipelineリゾルバーのメンテがしづらい • コードサイズ制限に引っかかる 18
リゾルバーの使い分け(現状) 19
リゾルバーの使い分け(現状) • Mutation系はLambdaに統⼀ ◦ middyの導⼊ • Pipelineリゾルバーを辞めた ◦ (管理コストを下げるため) 20
リゾルバーの使い分け(現状) • 結論 ◦ Lambdaの同時実⾏数を気にしてJSリゾ ルバーに寄せていたが、Lambdaの同時 実⾏数を気にするようなアクセス数に なった時はAppSync⾃体を剥がしたほう が良さそう 21
オニオンアーキテクチャの導⼊ 22
オニオンアーキテクチャの導⼊ • Lambdaリゾルバーに寄せたことで共通化 がしやすくなった • 将来的にDBが変わる可能性も考慮してディ レクトリ構成を全体的に⾒直した 23
オニオンアーキテクチャの導⼊ • /core ◦ /domain ◦ /infrastructure • /graphql ◦
スキーマとcodegenで⽣成したファイル 24
オニオンアーキテクチャの導⼊ 25
APIの認証⽅式を変えた 26
APIの認証⽅式を変えた • APIは3つ ◦ 管理者向け: Admin API ◦ ユーザー向け: Customer
API ◦ ゲストユーザー向け: Public API 27
APIの認証⽅式を変えた • Admin API ◦ Cognitoユーザープール(グループ) • Customer API ◦
Cognitoユーザープール • Public API ◦ APIキー 28
APIの認証⽅式を変えた • Admin API ◦ Cognitoユーザープール(グループ) • Customer API ◦
Cognitoユーザープール • Public API ◦ APIキー → IAM認証に切り替えた 29
APIの認証⽅式を変えた 30
APIの認証⽅式を変えた 31
APIの認証⽅式を変えた 32
APIの認証⽅式を変えた 33
バリデーションスキーマの⽣成 34
バリデーションスキーマの⽣成 • zodを導⼊ • codegenのプラグイン ◦ typescript-validation-schema ◦ @constraintに最⼤⽂字数等を指定 35
バリデーションスキーマの⽣成 36
バリデーションスキーマの⽣成 37
他開発ツール 38
他開発ツール周り • npm → pnpm にして扱いやすくなった • APIドキュメントの⾃動⽣成 ◦ magidocで⽣成
→ Cloudflare Pagesで公開 • CDKTFの導⼊ 39
CDKTFの導⼊ • CDK for Terraformを導⼊ • ⼀部のリソースでCloudflareを使っている ◦ CDN, DNS等
• 元々はterraformでやる想定だった • CDKに合わせてCDKTFでやることに 40
CDKTFの導⼊ • ⼀部のリソースでCloudflareを使っている ◦ CDN, DNS等 • 元々はterraformでやる想定だった • CDKに合わせてCDKTFでやることに
41 →Typescriptで統⼀できて管理コストが下がった
反省点 42
反省点 • 初⼿RDSにしておくべきだった • DB設計にもっと時間をかけるべきだった • そもそもAppSyncが適していなかったかも 43
まとめ • AppSyncの開発効率を最⼤限に活⽤するな らやはりAmplifyと使うのが有⽤ • GraphQL + monorepo = 相性良し
• ⾔語をtypescriptで統⼀できた(CDKTF) 44