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
8.3k
はじめてのGraphQLスキーマ設計
GraphQLのよいスキーマ設計についてです。
rikuson298
September 04, 2019
Tweet
Share
Other Decks in Technology
See All in Technology
セマンティックレイヤー入門
ikkimiyazaki
8
2.8k
チームビルディング「脅威モデリング」ワークショップ
koheiyoshikawa
0
130
製造業の会計システムをDDDで開発した話
caddi_eng
3
940
AI・LLM事業部のSREとタスクの自動運転
shinyorke
PRO
0
300
Cline、めっちゃ便利、お金が飛ぶ💸
iwamot
19
18k
Why Go?
xpmatteo
0
130
30代エンジニアが考える、エンジニア生存戦略~~セキュリティを添えて~~
masakiokuda
4
2k
AIエージェントキャッチアップと論文リサーチ
os1ma
6
1.2k
コンソールで学ぶ!AWS CodePipelineの機能とオプション
umekou
2
110
AIエージェント完全に理解した
segavvy
4
260
お問い合わせ対応の改善取り組みとその進め方
masartz
1
350
BCMathを高速化した一部始終をC言語でガチ目に解説する / BCMath performance improvement explanation
sakitakamachi
2
1.2k
Featured
See All Featured
Statistics for Hackers
jakevdp
798
220k
Adopting Sorbet at Scale
ufuk
75
9.3k
Typedesign – Prime Four
hannesfritz
41
2.6k
Music & Morning Musume
bryan
46
6.4k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7.1k
Making the Leap to Tech Lead
cromwellryan
133
9.2k
Gamification - CAS2011
davidbonilla
81
5.2k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.5k
The Cost Of JavaScript in 2023
addyosmani
48
7.6k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Building Applications with DynamoDB
mza
94
6.3k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
31
4.7k
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