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
入門Hasura
Search
ryo
December 05, 2019
Technology
2.9k
3
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
入門Hasura
もくテク #4 冬のLT大会
ryo
December 05, 2019
More Decks by ryo
See All by ryo
Bridging Social Graphs
kawamataryo
0
410
Raycast AI APIを使ってちょっと便利なAI拡張機能を作ってみた
kawamataryo
1
630
退屈なことはDevinにやらせよう〜〜Devin APIを使ったVisual Regression Testの自動追加〜
kawamataryo
5
2.4k
SaaS公式MCPサーバーをリリースして得た学び
kawamataryo
7
2.2k
Raycast AI APIを使ってちょっと便利な拡張機能を作ってみた / created-a-handy-extension-using-the-raycast-ai-api
kawamataryo
1
940
ts-morphのパフォーマンス改善Tips
kawamataryo
0
160
webpack to Rspack
kawamataryo
0
150
GitHub Actions と Datadog でコードベースの定点観測
kawamataryo
7
2.2k
個人開発駆動学習 / personal development driven learning
kawamataryo
1
330
Other Decks in Technology
See All in Technology
AIがGISを代替する日:〜すべてをAIが創る時代に、私たちがFOSS4Gに関わる意味〜
lehupa
1
210
Building Audio Plugin Ecosystem for Android in 2026
atsushieno
2
140
AI時代のエンジニアの情報発信〜個人の発信を組織の力に変える〜
ryo_kawamata
1
7.3k
AWS構成から考えるWebセキュリティ ― WordPressの構築経験から考える公開範囲と更新運用【JAWS FESTA 2026 in AKITA】
cscengineer
PRO
1
160
AWSを利用する上で知っておきたい名前解決の話 2026
nagisa53
3
740
Software Engineering in an AI-Driven World
erikjhordan_rey
0
110
WireGuard for Apache NuttX - Bringing Secure Remote Access to embedded Devices -
aki310ooooo
0
150
AIエージェント時代、Kaggleにどう取り組むか
takanao
2
500
Consistency for mere mortals - A gentle guide to consistency
ufried
0
120
令和の今、あらためて IAM を考える。アクセスキーを「無くせない現実」との向き合い方
kazzpapa3
0
140
続・ソフトウェアアーキテクトのための意思決定術: Decision Readiness, Revisited — When AI Changes the Economics of Software Architecture
snoozer05
PRO
6
1.6k
(swiftc) NonCopyableとライフタイム修飾子
teamhimeh
0
170
Featured
See All Featured
30 Presentation Tips
portentint
PRO
1
460
The Cost Of JavaScript in 2023
addyosmani
56
10k
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
560
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
Building Adaptive Systems
keathley
44
3.3k
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
810
Six Lessons from altMBA
skipperchong
29
4.6k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
68
60k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.6k
Ruling the World: When Life Gets Gamed
codingconduct
0
430
SEO Brein meetup: CTRL+C is not how to scale international SEO
lindahogenes
2
3k
Paper Plane
katiecoart
PRO
5
54k
Transcript
入門 Hasura 〜 HasuraでサクッとGraphQL 体験 〜 @RyoKawamata
自己紹介
@RyoKawamata 消防士歴 6年半, エンジニア歴 1年半 株式会社Misoca リモートワーク@茨城
今日話すこと
GraphQLの簡単な紹介 Hasuraで出来ること・出来ないこと
GraphQL とは何か?
API向けの問い合わせ言語・仕様
問い合わせ言語?
APIを対象にしたSQL的なもの
あるユーザーの 名前、会社名、URLを取得したい example
SELECT name, company, url FROM users WHERE id = '1234'
SQL DB
SQL DB name compony url ryo misoca misoca.jp
query getUser { user(id: ‘1234’) { name company url }
} GraphQL API Server
“data” { ”user” { “name”: “ryo” “company”: “misoca” “url”: “misoca.jp”
} } GraphQL API Server
• 必要なものを必要な分だけ取得できる • 単一のエンドポイント • 強力な型システムを持つ feature
REST API の課題とGraphQL
過剰な取得 必要のないデータまで まとめて取得してしまう
example ユーザーの名前とリポジトリ数を取得したい
REST Request GET https://api.github.com/users/${ username }
REST Response { "login": "kawamataryo", "id": 11070996, "node_id": "MDQ6VXNlcjExMDcwOTk2", "avatar_url":
"https://avatars1.githubusercontent.com/u/11070996?v=4", "gravatar_id": "", "public_repos": 95, "public_gists": 0, "followers": 8, "following": 7, "url": "https://api.github.com/users/kawamataryo", "html_url": "https://github.com/kawamataryo", "followers_url": "https://api.github.com/users/kawamataryo/followers", "following_url": "https://api.github.com/users/kawamataryo/following{/other_user}", "gists_url": "https://api.github.com/users/kawamataryo/gists{/gist_id}", . . 以下略
REST Response { "login": "kawamataryo", "id": 11070996, "node_id": "MDQ6VXNlcjExMDcwOTk2", "avatar_url":
"https://avatars1.githubusercontent.com/u/11070996?v=4", "gravatar_id": "", "public_repos": 95, "public_gists": 0, "followers": 8, "following": 7, "url": "https://api.github.com/users/kawamataryo", "html_url": "https://github.com/kawamataryo", "followers_url": "https://api.github.com/users/kawamataryo/followers", "following_url": "https://api.github.com/users/kawamataryo/following{/other_user}", "gists_url": "https://api.github.com/users/kawamataryo/gists{/gist_id}", . . 以下略 大量の不要なカラムも 取得してしまう
{ user(login: “username”) { name repositories { totalCount } }
} GraphQL Request POST https://api.github.com/graphql
{ "data": { "user": { "name": "ryo", "repositories": { "totalCount":
106 } } } } GraphQL Respose
{ "data": { "user": { "name": "ryo", "repositories": { "totalCount":
106 } } } } GraphQL Respose 必要なリソースのみ 宣言的に取得出来る
過小な取得 必要な情報によっては 複数回のリクエストを組み合わ せる必要がある。 (関連まで取りたい場合など)
example あるユーザーのフォロワー数と、 そのフォロワーのフォロワー数を取得したい
REST GET https://api.github.com/users/${ username }/followers でフォロワーを取得 さらにフォロワーの数だけ、同じリクエストを投げ て、全ての結果をカウントする。
REST GET https://api.github.com/users/${ username }/followers でフォロワーを取得 さらにフォロワーの数だけ、同じリクエストを投げ て、全ての結果をカウントする。 複数回のリクエストの 統合が必要
{ user(login: “username”) { followers { totalCount nodes { name
followers { totalCount } } } } } GraphQL Request
{ user(login: “username”) { followers { totalCount nodes { name
followers { totalCount } } } } } GraphQL Request 一つのリクエストで 関連のデータまでまとめて 取得出来る
つまり
GraphQL 最高便利..!!!
でも..
サーバーサイドの実装大変そう、、 自由に取れるってセキュリティ大丈夫?? そもそもAPI変えるほどの工数ない
大丈夫!!!
Hasura がある!!
Hasuraとは?
PostgreSQLのTableスキーマから GraphQLのAPIを自動生成するもの
None
DEMO
Hasuraの良いところ
CRUD・Subscription のクエリを自動で提供してくれる Pross
• ネストした関連データの取得 • 集計処理(count, sum, avg, max, min) • フィルター処理(eql,
pattern match) • 並び替え • ページネーション • トランザクションでの更新 • カスタムSQL関数を含むクエリ ...etc
テーブルのカラム単位で 操作の認可を設定できる Pross
None
Firebase, Auth0
Event Trigger・Remote Schema で柔軟なAPIも構築可能 Pross
Event Trigger 指定されたテーブルのイベントをトリガーに Webhookを呼び出してカスタムロジックを実行する機能
Remote Schema 独自に実装した GraphQLサーバーを Hasuraのエンドポイ ントにマージして利用 可能にする機能
Hasuraを使う上での注意
クエリに対するValidationが まぁまぁきつい Cons
PostgreSQLのTriggerで実行 or 別にGraphQL サーバーを立てて Remote Schema実行
まとめ
Hasuraは便利なものの 全てを解決すことはできない。 ただ、他サービスと上手く連携し作り上げられ れば、GraphQL APIサーバー構築の工数を大 幅に下げられる可能性はある
参考
O`REILLY 初めてのGraphQL ~ WEBサービスを作って学ぶ次世代API~ 定価 2,860 円