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
AppSync入門! GraphQL APIを作ってみた!
Search
Nao Masuya
October 26, 2023
Technology
1.1k
3
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
AppSync入門! GraphQL APIを作ってみた!
AppSync,GraphQLの簡単な紹介です!
Nao Masuya
October 26, 2023
More Decks by Nao Masuya
See All by Nao Masuya
久しぶりのAWS!JAWS!初めてBedrockを触ってリハビリ!
masuchoku
0
35
AWS Summit 2025 の見どころを振り返る!
masuchoku
0
430
AWS TransferFamilyを使ってみた!
masuchoku
0
490
AWSを触ってきた数年間を振り返る!
masuchoku
1
440
Step Functionsと少し仲良くなってみた
masuchoku
1
690
API Gatewayと少し仲良くなってみた!
masuchoku
0
1.2k
スライド作りから LTを楽しもう! エンジョイ、 エンジニアライフ!
masuchoku
1
710
APCのAWS認定マスターたちに聞いてみた
masuchoku
0
250
AWSとJenkinsおじさん で学んできたCI_CD
masuchoku
1
1.5k
Other Decks in Technology
See All in Technology
壊して学ぶAWS CDK: そのcdk deployで消えるもの、残るもの
k_adachi_01
1
460
アップデートで何が変わった?デモで学んで使いこなすIBM Bob2.0
muehara
0
220
AICoEでAIネイティブ組織への進化
yukiogawa
0
210
2年前に削除したPHPクラスが、 ある日突然決済をエラーにした
ykagano
1
720
非定型なドキュメントを効率よくリファクタする 〜えぇ!?仕様書27本の移行が1日で終わったって!?〜
subroh0508
2
600
人とエージェントが高め合う協業設計
kintotechdev
0
700
CDKで書くECSのベストプラクティス、 改めて考え直す2026 #cdkconf2026
makies
3
920
20260720_クラウド女子会×PyLadiesTokyoコラボ Amazon Bedrock ハンズオン用資料
yuuka51
1
110
”AIを使う” から ”AIに任せる” へ ─ 開発プロセスを再設計してAIを組織標準にするまで
cyberagentdevelopers
PRO
1
130
Alphaモジュール使っていいのかい!?いけないのかい!?どっちなんだいっ!?
watany
1
320
全員がリーダーである世界へ キリマンジャロ登頂とシェアド・リーダー
jinwatanabe
0
120
「顧客の声を聞かなければ何も始まらない」 ── 顧客の声から生まれた『AI返信補助機能』の開発プロセス / AICon2026_shikata_imai
rakus_dev
0
260
Featured
See All Featured
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
1
280
Optimising Largest Contentful Paint
csswizardry
37
3.8k
Believing is Seeing
oripsolob
1
170
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
880
Art, The Web, and Tiny UX
lynnandtonic
304
22k
Statistics for Hackers
jakevdp
799
230k
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9.1k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
techseoconnect
PRO
0
510
Reflections from 52 weeks, 52 projects
jeffersonlam
356
21k
Why Our Code Smells
bkeepers
PRO
340
58k
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
aleyda
1
1.3k
Are puppies a ranking factor?
jonoalderson
1
3.7k
Transcript
AppSync入門! GraphQL APIを 作ってみた! 2023/10/25 JAWS UG 朝会 APCommunications 升谷直緒
Self Introduction 所属 株式会社エーピーコミュニケーションズ @apc_tweet
Self Introduction 株式会社 エーピーコミュニケーションズ システム基盤サービス事業本部 クラウド事業部 IaC技術推進部 升谷直緒 • 2020年新卒入社
• SIerとして4年目 • AWSは使い始めて3年目 • CI/CDの導入支援 • Webアプリの改善運用 • リモートワーク @masuchoku
JAWSに参加してみて 今年の3月ごろから月1ペースでJAWSに参加、LTは4回目です。 社外の人と関われる貴重な機会、 普段使わないAWSサービスに触れる、 アウトプットと向き合うことができる、 初心者にすごく優しいコミュニティ …な点がいいなと感じております!
本日は、、 GraphQL APIはこんなに簡単にAWSで作れるのか!? をお伝えしたいです! ぜひ今日お時間があれば作ってみてください...!
App Sync とは サーバレスにGraphQLを使用し、データベースに接続で きるサービス。 1 つの GraphQL API エンドポイントから
1 つ以上の データソースのデータにアクセスする。
クエリ言語とスキーマ言語で構成された Web APIの規格。 サーバーにデータを問い合わせることができる。 RESTの場合、必要のないデータまで取得してしまうため、大量 のデータを処理する必要があったため、 GraphQLが開発され た。 Facebook社によって2012年に開発がスタートし、 2015年にオー
プンソース化された。 GraphQL とは
REST と GraphQL REST GraphQL クエリ { user(id: 1) {
name } } レスポンス { "data": { "user": { "name": "Nao Masuya" } } } GETリクエスト GET /users レスポンス [ {"id": 1, "name": "Nao Masuya"}, {"id": 2, "name": "Simba"} ] 「単一のURLエンドポイント」にク エリを行えば、クエリに応じた データを返すことができる。
RESTを使う User API Gateway Lambda RDS ドラキュラはこういうユーザー • アプリケーションの規模が小さく、データがそれ ほど複雑ではない
• すべてのクライアントが同じように使用するデー タと操作がある • 複雑なデータクエリの必要がない https://aws.amazon.com/jp/compare/the-difference-between-graphql-and-rest/
DynamoDBの 参照・削除・更新がしたい クエリを書くだけ GraphQLを使う User App Sync DynamoDB ゾンビはこういうユーザー •
帯域幅に制限があり、リクエストとレスポンスの数を最小限に抑えたい • 複数のデータソースがあり、それらを 1 つのエンドポイントにまとめたい • クライアントのリクエストが大きく異なり、求められるレスポンスも大きく異なる https://aws.amazon.com/jp/compare/the-difference-between-graphql-and-rest/
AppSyncの実装はとても簡単 DynamoDBを選択 API名を決める クエリの要素を入力
クエリを実行 DynamoDBで確認
認証方法 API_KEY AWS_LAMBDA AWS_IAM OPENID_CONNECT AMAZON_COGNITO_USER_POOLS から選べます!
IAMを使った認証方法 IAM Policyを作成してUserに紐付ける { "Version": "2012-10-17", "Statement": [ { "Effect":
"Allow", "Action": [ "appsync:GraphQL" ], "Resource": [ "作成したAPIのarn:aws/*" // やりたい放題 "作成したAPIのarn:aws/types/Query/*” // 取得 "作成したAPIのarn:aws/types/Mutation/*” // 挿入更新削除 "作成したAPIのarn:aws/types/Subscription/*” // 監視 ] } ] }
CREDITS: This presentation template was created by Slidesgo, including icons
by Flaticon, infographics & images by Freepik Thank you! AppSync,GraphQLの簡単な紹介でした! Happy Halloween!
Resources • GraphQLとRESTの比較 ◦ https://hasura.io/learn/ja/graphql/intro-graphql/graphql-vs-rest/ • AWS AppSync の概要 ◦
https://docs.aws.amazon.com/ja_jp/appsync/latest/devguide/what-is-appsync.html • GraphQLとは?RESTとの違いや導入事例を紹介 ◦ https://udemy.benesse.co.jp/development/system/graphql.html • GraphQL と REST の違いは? ◦ https://aws.amazon.com/jp/compare/the-difference-between-graphql-and-rest/ • 承認と認証 ◦ https://docs.aws.amazon.com/ja_jp/appsync/latest/devguide/security-authz.html