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
kinocoboy
October 22, 2021
Programming
0
100
データの可視化とGraphQLを学ぶモチベーション
NINNO Tech Fest #2
データの可視化とGraphQLを学ぶモチベーション
kinocoboy
October 22, 2021
Tweet
Share
More Decks by kinocoboy
See All by kinocoboy
フロントエンドにおける「型」の責任分解に対する1つのアプローチ
kinocoboy2
5
1.9k
メタファーの使い方
kinocoboy2
0
300
LLMとPlaywright/reg-suitを活用した jQueryリファクタリングの実際
kinocoboy2
5
1.2k
UIパフォーマンス最適化: AIを活用して100倍の速度向上を実現した事例
kinocoboy2
1
1k
【ScrumFestNiigata2024】a11yを起点とした組織横断を完了するためにアジャイルチームにとって大切だったこと100選
kinocoboy2
0
670
JSConfjp2023 Storybook駆動開発の再現性と効率化
kinocoboy2
2
4.1k
新卒だったころの僕へ向けて
kinocoboy2
0
210
スクラムマスターを目指すためにギャルになってみた話
kinocoboy2
9
11k
NINNO Tech Fest #05 春の推し
kinocoboy2
0
290
Other Decks in Programming
See All in Programming
JETLS.jl ─ A New Language Server for Julia
abap34
2
470
Denoのセキュリティに関する仕組みの紹介 (toranoana.deno #23)
uki00a
0
220
Basic Architectures
denyspoltorak
0
170
組み合わせ爆発にのまれない - 責務分割 x テスト
halhorn
1
180
Graviton と Nitro と私
maroon1st
0
160
안드로이드 9년차 개발자, 프론트엔드 주니어로 커리어 리셋하기
maryang
1
150
それ、本当に安全? ファイルアップロードで見落としがちなセキュリティリスクと対策
penpeen
6
1.8k
脳の「省エネモード」をデバッグする ~System 1(直感)と System 2(論理)の切り替え~
panda728
PRO
0
130
大規模Cloud Native環境におけるFalcoの運用
owlinux1000
0
240
リリース時」テストから「デイリー実行」へ!開発マネージャが取り組んだ、レガシー自動テストのモダン化戦略
goataka
0
160
Patterns of Patterns
denyspoltorak
0
420
【卒業研究】会話ログ分析によるユーザーごとの関心に応じた話題提案手法
momok47
0
160
Featured
See All Featured
Site-Speed That Sticks
csswizardry
13
1k
How STYLIGHT went responsive
nonsquared
100
6k
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
140
Ten Tips & Tricks for a 🌱 transition
stuffmc
0
47
The Spectacular Lies of Maps
axbom
PRO
1
420
Information Architects: The Missing Link in Design Systems
soysaucechin
0
730
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.3k
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
chikuwait
0
270
Odyssey Design
rkendrick25
PRO
0
450
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
250
What the history of the web can teach us about the future of AI
inesmontani
PRO
0
390
Building an army of robots
kneath
306
46k
Transcript
NINNO Tech Fest #2 2021.10.22 גࣜձࣾKUNO Լതو σʔλͷՄࢹԽͱGraphQLΛֶͿϞνϕʔγϣϯ
Self Introduction Hiroki.Kinoshita גࣜձࣾKUNO ਂֶशͱΫϥυΛۦ͢ΔDXاۀ Front Engineer / Designer Peacock
Engineer Group ( PEG ) Organizer Twitter: @kinocoboy2
ͳͥσʔλΛՄࢹԽΛ͢Δͷ͔
݁ɺϝϦοτ͕ଟ͍͔Β σʔλͷՄࢹԽΛ͢Δ͜ͱͷϝϦοτ ᶃ ؾ͚ͮΔ ᶄ அͰ͖Δ ᶅ Ԡ༻Ͱ͖Δ ᶆ etc…
σʔλͷՄࢹԽΛߦ͏ͨΊʹେࣄͳ͜ͱ ᶃ Ӿཡऀͷχʔζʹ߹Θͤͯ࡞͢Δ Ӿཡऀ͕ݟͯΘ͔Βͳ͍ ใաଟͰٯʹࠞཚΛট͘ ᶄ σʔλͷҙຯΛਂ͘ཧղ͢Δ ͳΜͷҙຯΛ࣋ͭࢦඪͳͷ͔Λ͔ͬ͠ΓѲ͢Δඞཁ͕͋Δ ؒҧͬͨσʔλΛूΊͯ͠·͏ɾҙຯΛؒҧ͑Δ
Ձ͋ΔՄࢹԽΛ͢ΔͨΊʹ ᶃ ࣮ݱ͍ͨ͠ͷͷݴޠԽΛపఈతʹߦ͏ υϝΠϯۦಈઃܭϢʔβʔετʔϦʔϚοϐϯάɺϞσϦϯάͳͲ৭ʑʹ ͳΔͷ͕ଟ͘ͳ͍ͬͯΔɻ ᶄ ͱʹ͔͘ࢼߦࡨޡ͠࠷దղΛಈ͖ͳ͕Βݟ͚ͭΔέʔε͕ଟ͍ ᶅ ํసͨΓલͷΑ͏ʹى͖Δͷ 👆
͜Ε͕ͱʹ͔͘Τά͍
None
ΫϥΠΞϯτ։ൃ͕ਏ͗͢Δ
RestAPI
REST API ͩͱɺͳͥΫϥΠΞϯτ͕ਏ͍͔ ᶃ API ଆͷ ΠϯλʔϑΣʔε ͕ ֓೦ͷมԽʹΑͬͯॊೈʹมಈ͢Δ ΠϯλʔϑΣʔε
͕มԽ͢ΔͨͼʹɺΫϥΠΞϯτଆͷ࣮͕ൃੜ ΠϯλʔϑΣʔε͕ఏڙ͞ΕΔ·ͰɺΫϥΠΞϯτԿͰ͖ͳ ͍ ᶄ ϑϩϯτଆͷ ը໘෦ ͷ߲Ճ͋Δ ΠϯλʔϑΣʔεमਖ਼ґཔΛ͢Δඞཁ͕͋Δ ΫϥΠΞϯτ͚ͩͰ߲Ճ͕݁͠ͳ͍
GraphQL
GraphQL ͱ ͬ͘͟Γݴ͏ͱ ᶃ GraphQL ΫϥΠΞϯτ͕ඞཁͳσʔλΛ API ͔ΒϑΣον͢ΔͨΊʹ ઃܭ͞Εͨݴޠ
ᶄ GraphQL Λ༻͢ΔͱɺΫϥΠΞϯτ όοΫΤϯυ API ͔Β ඞཁͳσʔλͷܕͱγΣΠϓΛऔಘՄೳ ᶅ GraphQL ͰɺͲΜͳλΠϓͷϦΫΤετͰɺ ΫϥΠΞϯτ ΞϓϦέʔγϣϯ͕ݺͼग़͢ΤϯυϙΠϯτ 1 ͚ͭͩ ᶆ GraphQL SQL ͱΑ͘ࣅ͍ͯ·͕͢ɺϑϩϯτΤϯυͰػೳ͢Δ
GraphQL ͱ తʹ͍͏ͱɺΫϥΠΞϯτ։ൃ ͱ όοΫΤϯυ։ൃͷΛత ͱ͍ͯ͠Δɻ ΤϯυϙΠϯτ͕̍ͭఏڙ͞ΕΕɺΫϥΠΞϯτଆ͕ཉ͍͠ใ Λࣗ༝ʹҾ͖ग़͠ͳ͕Β։ൃ͢Δ͜ͱ͕Մೳɻ SQLΛΫϥΠΞϯτଆ͕ॻ͍ͯɺόοΫΤϯυʹ࣮ߦͤ͞ΔΠϝʔδ
·ͱΊ ᶃ ΤϯδχΞೲΛσϦόϦʔ͢ΔͷͰͳ͘ɺೲͰಘΒΕΔՁΛσϦό Ϧʔ͢ΔଘࡏʹͳΔ ᶄ ՁΛσϦόϦʔ͢Δ߹ɺDDDϞσϦϯάɺϢʔβʔετʔϦʔϚοϐϯάͳͲ ͷతۦಈઃܭ͕ඞཁʹͳͬͯ͘Δɻ ᶅ తۦಈઃܭͷ߹ɺैདྷͷRestAPI ͱ
ΫϥΠΞϯτͷΈ߹ΘͤͩͱΫϥΠΞϯτ ։ൃ͕ਏ͍ɻ(ࡾॏ;Γ͜ʣ ᶆ ͦͷͨΊʹɺΫϥΠΞϯτͱRestAPIΛͰ͖Δ GraphQL తۦಈઃܭʹ༗ ޮɻ ᶇ ࢼߦࡨޡͰ͖ΔͷͰɺσʔλΛϢʔβʔͷχʔζʹ߹ΘͤͯՄࢹԽͰ͖ΔΑ͏ʹͳ Δɻ
GraphQLɺ͋Γ͔ͳʔ ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠