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
はじめてのGraphQLスキーマ設計
Search
rikuson298
September 04, 2019
Technology
13
7.7k
はじめてのGraphQLスキーマ設計
GraphQLのよいスキーマ設計についてです。
rikuson298
September 04, 2019
Tweet
Share
Other Decks in Technology
See All in Technology
Cloud Service Mesh に触れ合う
phaya72
1
230
Amplify 🩷 Bedrock 〜生成AI入門〜
minorun365
PRO
8
770
EM完全に理解した と思ったけど、 やっぱり何も分からなかった話 / EM Night Fukuoka #1
hirutas
0
280
Cracking the KubeCon CfP
inductor
2
270
Babylon.js JAPAN活動紹介 (2024/4)
limes2018
1
120
【SORACOM UG 東海】あらゆるモノがつながる社会へ、IoT と SORACOM
soracom
PRO
1
140
いいたいことちゃんという
tkengo
0
230
LangSmith入門―トレース/評価/プロンプト管理などを担うLLMアプリ開発プラットフォーム
os1ma
5
710
M&A戦略を支えるデータマネジメント (MIDAS Tech Study #16 GENDA Komiyama)
kommy339
1
110
require(ESM)とECMAScript仕様
uhyo
4
980
データベース02: データベースの概念
trycycle
0
180
リテール金融(キャッシュレス・ネット銀行・ネット証券)の競争環境と経済圏
8maki
0
1.6k
Featured
See All Featured
Git: the NoSQL Database
bkeepers
PRO
423
63k
Building Applications with DynamoDB
mza
88
5.6k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
126
32k
Navigating Team Friction
lara
179
13k
What's new in Ruby 2.0
geeforr
337
31k
Build The Right Thing And Hit Your Dates
maggiecrowley
25
2k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
21
1.9k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.7k
GraphQLの誤解/rethinking-graphql
sonatard
55
9.3k
Raft: Consensus for Rubyists
vanstee
133
6.3k
Building an army of robots
kneath
300
41k
ParisWeb 2013: Learning to Love: Crash Course in Emotional UX Design
dotmariusz
104
6.6k
Transcript
はじめての GraphQLスキーマ設計 2019/9/5 フロントエンドNight #1@ギフティ A1A株式会社 住奥 陸
2 自己紹介 Name Company Career Twitter Other 住奥 陸(すみおくりく) A1A株式会社(エイワンエイ)
ワークス → ジラフ → A1A @rikuson298 フロント, バックエンド, データモデリングなどア プリ開発を担当
3 Vision A1A(社名の由来) B2B をワンランク上に
4 技術スタック Frontend Backend API
5 はじめに GraphQLといえば 何を思い浮かべるでしょうか?
6 GraphQLといえば スキーマ定義の型付けによる 堅牢な開発
7 GraphQLといえば スキーマ駆動開発による 開発効率の向上
8 GraphQLといえば GraphQLではスキーマ定義によって フロントとバックエンドの依存を減らせる
9 GraphQLといえば 良いスキーマ設計されていれば...
10 これから話すこと メリットを効果的に享受するための スキーマ設計のポイントを説明します。
11 Agenda 1. 実装の詳細を含めない 2. ビジネスロジックを提供する 3. まとめ
12 サンプルの説明 簡単なカンバンツールの実装を例に説明します(Trelloみたいな)
13 サンプルのテーブル構造 List - id - title Card - id
- label - list_id
14 サンプルのスキーマ
15 Agenda 1. 実装の詳細を含めない 2. ビジネスロジックを提供する 3. まとめ
16 サンプルに仕様追加 カードにタグを設定できる仕様に
17 サンプルのテーブル構造 List - id - title Card - id
- label - list_id CardTag - id - card_id - tag_id Tag - id - title 追加
18 スキーマ設計:NGパターン テーブル構造をそのまま スキーマに反映する
19 スキーマ設計:NGパターン CardTagは多対多を実現する 関連テーブルであるため 機能には関係がない
20 スキーマ設計:NGパターン また、多対多の実装方法が 変更された際に修正が必要に
21 スキーマ設計:NGパターン 実装の詳細をスキーマに含めると バックエンドの実装変更によって フロントエンドが影響を受けやすくなってしまう
22 スキーマ設計:GOODパターン Card 型に tags フィールドを追加する
23 スキーマ設計:GOODパターン 関連テーブルを挟まないので フロント側で扱いやすくなる
24 スキーマ設計:GOODパターン 実装の詳細が含まない ↓ バックエンドの実装変更による影響を受けづらい
25 Agenda 1. 実装の詳細を含めない 2. ビジネスロジックを提供する 3. まとめ
26 サンプルに仕様追加 カードが作成から一定期間経過すると変色し、通知される仕様に
27 サンプルのテーブル構造 List - id - title Card - id
- label - list_id - created_at
28 スキーマ設計:NGパターン Card 型のフィールドに created_at のみ追加する
29 スキーマ設計:NGパターン カードを変色させるために created_at を元に 一定期間経過したかを判定する ビジネスロジックをフロントに持つ必要がある
30 スキーマ設計:NGパターン 一方、カードの変色を通知するために バックエンドでも同じビジネスロジックが必要に
31 スキーマ設計:NGパターン created_at のみ提供する ↓ バックエンドとフロントエンドで ビジネスロジックの二重管理になりバグの温床に
32 スキーマ設計:GOODパターン Card 型のフィールドに created_atをもとに一定期間をど のくらい経過したか判定した corrosion_rateを提供する
33 スキーマ設計:GOODパターン 統一の corrosion_rate を元にカードの変色と 変色通知を実装できる
34 スキーマ設計:GOODパターン バックエンドにビジネスロジックを統一でき フロントエンドとの二重管理を防げる
35 Agenda 1. 実装の詳細を含めない 2. ビジネスロジックを提供する 3. まとめ
36 まとめ • 適切なスキーマ設計により、バックエンドとフロントエンドの依存を 減らせて幸せになれる • スキーマに実装の詳細を含めない ◦ 安直にテーブル構造と同じにするのはダメゼッタイ •
ビジネスロジックも提供する ◦ ロジックの二重管理から開放される
37 We Are Hiring! A1A