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
スキーマと型で拓く Full-Stack TypeScript / TSKaigi 2025
Search
Altech
May 22, 2025
Technology
3
2.7k
スキーマと型で拓く Full-Stack TypeScript / TSKaigi 2025
TS Kaigi 2015 でお話しした資料です。
https://2025.tskaigi.org/talks/Altech_2015
Altech
May 22, 2025
Tweet
Share
More Decks by Altech
See All by Altech
継続的なサービス発展を支えるアーキテクチャと技術 / Developers Summit 2023
altech
20
6.3k
Wantedly の技術とアーキテクチャ / 2023年度 新人研修
altech
2
680
技術を的に当てる技術について - GraphQL を入れ直した話 / 吉祥寺.pm28
altech
7
6k
マイクロサービス・アーキテクチャと共存する Ruby on Rails のアーキテクチャ的拡張 - その事例と可能性 / Kaigi on Rails 2021
altech
8
3.5k
ソフトウェア設計の Why & What & How / Wantedly 新卒研修
altech
0
11k
Data-Driven Service-Oriented Architecture & UI
altech
3
1.6k
Ruby で作るデータ分析基盤
altech
9
2k
Object-Oriented Abstraction of Redis Sorted Set
altech
2
2.4k
Microservices on “Rails” - Wantedly のマイクロサービス事例
altech
8
5.7k
Other Decks in Technology
See All in Technology
なぜ私はいま、ここにいるのか? #もがく中堅デザイナー #プロダクトデザイナー
bengo4com
0
1.3k
ハッカソン by 生成AIハッカソンvol.05
1ftseabass
PRO
0
140
LangChain Interrupt & LangChain Ambassadors meetingレポート
os1ma
2
220
GitHub Copilot の概要
tomokusaba
1
150
タイミーのデータモデリング事例と今後のチャレンジ
ttccddtoki
4
1.4k
B2C&B2B&社内向けサービスを抱える開発組織におけるサービス価値を最大化するイニシアチブ管理
belongadmin
0
130
Tokyo_reInforce_2025_recap_iam_access_analyzer
hiashisan
0
140
「良さそう」と「とても良い」の間には 「良さそうだがホンマか」がたくさんある / 2025.07.01 LLM品質Night
smiyawaki0820
1
430
2025-06-26_Lightning_Talk_for_Lightning_Talks
_hashimo2
2
110
生成AI時代 文字コードを学ぶ意義を見出せるか?
hrsued
1
730
論文紹介:LLMDet (CVPR2025 Highlight)
tattaka
0
240
Fabric + Databricks 2025.6 の最新情報ピックアップ
ryomaru0825
1
160
Featured
See All Featured
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
60k
Automating Front-end Workflow
addyosmani
1370
200k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
138
34k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.7k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.6k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Designing for Performance
lara
609
69k
BBQ
matthewcrist
89
9.7k
Git: the NoSQL Database
bkeepers
PRO
430
65k
Transcript
4PIFJ5BLFOP54,BJHJ εΩʔϚͱܕͰ͘ 'VMM4UBDL5ZQF4DSJQU
ຊൃදʹ͍ͭͯ 'VMM4UBDL5ZQF4DSJQUΛग़ൃͱͯ͠ɺlͲΜͳz'VMM4UBDL54͔Β࢝Ί Δͱྑ͍͔ΛൃలՄೳੑؚΊͯߟ͠·͢ɻ ͦΕΛ౿·͑ͯιϑτΣΞͷશମΛߏ͢ΔΞʔΩςΫνϟɾελΠϧͱ ͯ͠(SBQI2-ʹΑΔʮεΩʔϚۦಈͷ'VMM4UBDL5ZQF4DSJQUʯΛհ͠ ·͢ɻ ͜ͷൃද͕ࠓޙͷ'VMM4UBDL54ͷ͕ΓͷҰॿʹͳΕͱࢥ͍·͢ɻ
ࣗݾհ • 4PIFJ5BLFOP • 4"/6 d • ࠷ॳͷιϑτΣΞΤϯδχΞͱͯ͠ࢀը
• ιϑτΣΞྖҬͷٕज़͓Αͼ৫ͷԽ • 8BOUFEMZ d • ϓϩμΫτ։ൃɾٕज़ج൫ɾϚωδϝϯτͳͲ • ٕज़ɿ3VCZˠ3VCZ 5ZQF4DSJQU (P 1ZUIPO(SBQI2- H31$ • ຊൃද4"/6ʹ͓͚ΔऔΓΈͰ͕͢ɺલ৬ʹ͓͚Δܦݧಉ࣌ͷଞࣾͷऔΓ Έ͔Βଟ͘ͷώϯτΛಘ͍ͯ·͢💡 !"MUFDI@
• εϚϗͰ༧ͯ͠ɺ͙͢ʹࣗવͷத • ιϑτΣΞ׆༻ͯ͠ӡӦΛ࣮ݱ • શࠃڌҎ্Λల։த 4"/6OE)PNFʹ͍ͭͯ
࣮ɺ࠷ॳϊʔίʔυͰ ্ཱ͕ͪͬͨαʔϏε • ॳظ͔ΒϊʔίʔυπʔϧΛ༻ ͯ͠αʔϏεΛ։ൃɾӡӦ • δϣΠϯͨ࣌͠Ͱը໘Ҏ ্ɺΧϥϜͷσʔλΛ࣋ͭ தنαʔϏε
• εϚʔτϩοΫɾΦϯϥΠϯܾࡁ ͳͲෳͷ֎෦4BB4ͱଟ֯తʹ ࿈ܞ IUUQTOPUFDPNTBOV@DPNOOGDECD
ࣄۀల։ͷதͰϑϧϦϓϨΠεΛ࣮ࢪ • ࠓޙͷల։Λ౿·͑ͯϑϧϦϓϨΠεΛ։࢝ˠ'VMM4UBDL5ZQF4DSJQUΛ࠾༻ • ࣄۀతʹ֦େϑΣʔζͷͨΊ৽αʔϏεల։ʢچγεςϜͷ։ൃʣͱฒߦͯ͠৽γες ϜΛ։ൃɺޙʹҠߦͨ͠ ͜ͷΑ͏ͳڧ͕ཁٻ͞ΕΔ։ൃʹ͓͍ͯεΩʔϚۦಈͷ'VMM4UBDL54͕େ׆༂🌸 ڌ
ݐஙϞσϧ αʔϏεܗଶ αϒεΫ ୯ധɾαϒεΫɾڞಉॴ༗ɾ౩ॴ༗ ҠߦݩγεςϜن ΧϥϜ ΧϥϜ اۀϑΣʔζ γϦʔζ" γϦʔζ#Ϋϩʔζ ༨ஊɿϊʔίʔυͰԯҎ্ௐୡͨ͠ࠃ།ҰͷαʔϏε😁
ຊͷΞτϥΠϯ ࣗݾհɾഎܠઆ໌ˡ͜͜·Ͱ ΞʔΩςΫνϟϨϕϧͷઃܭ ίʔυͰݟΔεΩʔϚۦಈ։ൃ ·ͱΊ
ΞʔΩςΫνϟϨϕϧͷઃܭ
ࢦͨ͜͠ͱ zεϐʔυΛ٘ਜ਼ʹͤͣɺ࣋ଓతʹ͢ΔιϑτΣΞΛ࡞Δz ࣄۀͱϓϩμΫτΛத৺ͱͨ͠ϑϧαΠΫϧ։ൃγϯϓϧͳ͜ͱΛγϯϓϧʹ࣮ݱ͠ ͳ͕Βɺઐੑͷߴ͍ղܾ͕Ͱ͖Δ࠷খηοτͷٕज़બఆΛͭͭ͠কདྷͷٕज़બ ΛݮΒ͞ͳ్͍தͰڊେͳϦΞʔΩςΫνϟͰΛࢭΊͳ͍ʜ
࠾༻ͨ͠ΞʔΩςΫνϟ
࠾༻ͨ͠ΞʔΩςΫνϟ ׂͱී௨🤔
Ұาͬͯ༻ޠఆٛɿ ΫϥΠΞϯταΠυαʔόʔαΠυɺϑϩϯτΤϯυόοΫΤϯυ ϥϯλΠϜ۠ ͷҧ͍ ΫϥΠΞϯταΠυ αʔόʔαΠυ ϑϩϯτΤϯυ όοΫΤϯυ ɾϢʔβʔͱΛ࣋ͭ
6* ɾ࣮ࡏͱମݧΛΓग़͢ 69 ɾϏδωεϧʔϧΛแ ɾσʔλϕʔεͱ࿈ܞ ɾखݩͷσόΠεͰಈ࡞ ɾωοτϫʔΫͷઌͰಈ࡞ ▶︎ ͜ͷೋ͕ͭϓϩάϥϜߏ্໌֬ʹ͔ΕΔ͔ઃܭ্ͷબʹͳΔ
ϑϩϯτΤϯυͱόοΫΤϯυͷ໌֬ͳΛબ େࣄʹͨ͜͠ͱɿ • ઃܭඪɿʢͲͪΒ͔ͱ͍͏ͱʣରਓઐ༻ੑΛॏࢹ͢ΔϑϩϯτΤϯυͱɺγεςϜͱͯ͠ͷ൚ ༻ੑͱυϝΠϯͷෳࡶੑʹ͖߹͏όοΫΤϯυ • ৫จԽɿϑϧαΠΫϧͰͷ։ൃΛଅਐͭͭ͠ɺઐతͳྖҬ͕͋Δ͜ͱΛೝΊΔ • ٕज़ઓུɿ࣮ߦσόΠεʹґଘ͠ྲྀಈੑߴ͍ϑϩϯτΤϯυٕज़ʹରͯ͠ɺൺֱత҆ఆͯ͠
σϓϩΠ༰қͳαʔόʔαΠυٕज़ • Ҏ্ͷશͯͱ૬ޓ࡞༻͠ͳ͕ΒਐԽ͢ΔΞʔΩςΫνϟʢޙड़ʣ • બɿϑϩϯτΤϯυͱόοΫΤϯυΛ͢Δ • ٕज़ͱͯ͠(SBQI2-Λ࠾༻
ٕज़ͱͯ͠ͷ(SBQI2-ʹ͍ͭͯ • ιϑτΣΞͷΠϯλʔϑΣΠεΛεΩʔϚͱͯ͠ఆٛ͢Δ • όοΫΤϯυεΩʔϚΛຬͨ͢Α͏ʹ࣮͢Δ • ϑϩϯτΤϯυεΩʔϚΛݩʹΫΤϦΛൃߦ͢Δ • ࣮͕ΠϯλʔϑΣΠεʹґଘ͢ΔͨΊɺదʹεΩʔϚΛઃܭ͢Δ͜ͱͰૄ݁߹ͷԸܙ͕͋Δ
(SBQI2-ΫΤϦ query SanuAreas { areas { name sites { name rooms { code } } } } { "data": { "areas": [ { "name": "ീϲַ", "sites": [ { "name": "ീϲַ 1st", "rooms": [ { "code": "0103" }, { "code": "0102" } (SBQI2-Ϩεϙϯε
࠾༻ͨ͠ΞʔΩςΫνϟʢ࣮ࡍʣ • ϞϊϨϙ͕ͩ'&#&ΛཧతʹʢผͷOQNύοέʔδʹͳΔʣ • αʔόʔଆ୯Ұͷ/PEFKTϓϩηεͱͯ͠ಈ͔͠ɺ'&#&྆ํͱͯ͠ৼΔ͏ • ඞཁʹԠͯ͡'&#&ͰͷαʔόʔɾσϓϩΠαΠΫϧͷͳͲՄೳ
ਐԽ͢ΔΞʔΩςΫνϟɿ ϑϩϯτΤϯυͷଟ༷Խ
ਐԽ͢ΔΞʔΩςΫνϟɿ ϑϩϯτΤϯυͷଟ༷Խ • ϢʔεέʔεڥʹԠͯ͡ҟͳΔ ϑϩϯτΤϯυΛఏڙ͍ͯ͘͠έʔε • ࠷దͳٕज़͕54ͱݶΒͳ͍ • ࣮ࡍ4"/6Ͱཧ༻ΞϓϦʹ
ϩʔίʔυٕज़ 3FUPPM Λ࠾༻ • (SBQI2-Ͱఏڙ͢Δใ͕ಉ͡Ͱ͋Ε όοΫΤϯυͷมߋͳ͠Ͱల։Ͱ͖Δ ݱͷ8FCαʔϏε࣮ࣾձͷଟ༷ͳεςʔΫϗϧμʔΛר͖ࠐΜͰ՝Λղܾ͢Δέʔεଟ͘ͳ͍ͬͯΔͨΊɺ γεςϜڞ௨͕ͩҟͳΔΞϓϦΛఏڙ͢Δɺͱ͍ͬͨ͜ͱ4"/6ʹݶΒͣҙ֎ͱଟ͍ͷͰͳ͍Ͱ͠ΐ͏͔
ਐԽ͢ΔΞʔΩςΫνϟɿ όοΫΤϯυͷߴԽ
ਐԽ͢ΔΞʔΩςΫνϟɿ όοΫΤϯυͷߴԽ • ֎෦γεςϜʹྲྀͨ͠ΓɺෳࡶͳॲཧΛ αϒγεςϜͰ࣮ݱ͢Δέʔε • (SBQI2-εΩʔϚ͑͞ຬͨͤɺඞཁͳ෦ ͚ͩผγεςϜͱͯ͠ɾ౷߹͕༰қʢࢧ ԉٕज़͕๛ʣ
• ܾΊଧͪͰͳٕ͘ज़తબࢶ͕͋Δ ͜ͱ͕தظతʹਖ਼͍͠ਐԽΛଅ͢
εϐʔυΛ٘ਜ਼ʹ͠ͳ͍ͭͷ όοΫΤϯυͱϑϩϯτΤϯυΛ͚Δ͜ͱͰൃੜ͢ΔΦʔόʔϔουʹରॲɿ • ։ൃ࣌ɿαʔόʔͷىಈɾ࿈ܞ͕໘ʹͳΔ • ➡ϑϩϯτΤϯυͷ/FYUKTαʔόʔʹόοΫΤϯυಉࠝ✅ίϚϯυͰىಈɾऴྃ • ӡ༻࣌ɿΠϯϑϥ$*$%͕ෳࡶʹ •
➡ϞϊϨϙΛ7FSDFMʹ࿈ܞͯ͠αʔόϨεʹ͓ͤ • ✅ચ࿅͞Εͨ։ൃϓϥοτϑΥʔϜͰɺΤϯδχΞϓϩμΫτ։ൃʹूத • ࣮ߦ࣌ɿωοτϫʔΫΛܦ༝͢Δ͜ͱʹΑΔίετɾ૿ • ➡αʔόʔαΠυ͔Βͷ(SBQI2-ݺͼग़͠τϥϯεϙʔτΛ)551͔Βࠩ͠ସ͑ • ✅༨ͳαʔόϨεɾϑΝϯΫγϣϯͷىಈΛ͑Δ͜ͱ͕Ͱ͖ͨ
ࢦͨ͜͠ͱʢ࠶ܝʣ zεϐʔυΛ٘ਜ਼ʹͤͣɺ࣋ଓతʹ͢ΔιϑτΣΞΛ࡞Δz
ࢦͨ͜͠ͱʢ࠶ܝʣ zεϐʔυΛ٘ਜ਼ʹͤͣɺ࣋ଓతʹ͢ΔιϑτΣΞΛ࡞Δz 'VMM4UBDL5ZQF4DSJQUͰ࣮ݱ
ࢦͨ͜͠ͱʢ࠶ܝʣ zεϐʔυΛ٘ਜ਼ʹͤͣɺ࣋ଓతʹ͢ΔιϑτΣΞΛ࡞Δz εΩʔϚʹΑΔͰ࣮ݱ
ࢦͨ͜͠ͱʢ࠶ܝʣ zεϐʔυΛ٘ਜ਼ʹͤͣɺ࣋ଓతʹ͢ΔιϑτΣΞΛ࡞Δz
ίʔυϨϕϧͰݟΔ εΩʔϚͱܕ͕ͨΒ͢Ձ
࠷ॳʹ͓ͼ🙏 ൃද࣌ؒͷ߹͋Γ(SBQI2-Y5ZQF4DSJQUΛͬͨ։ൃͷΠϩϋ͔ΒຊηογϣϯͰ ѻ͏͜ͱͰ͖·ͤΜͰͨ͠ɻ ࢝ΊΔࡍͷखҾ͖ͱͯ͠ڈͷ54,BJHJͰͷ!IPLBDDIB͞ΜʹΑΔ5ZQF4DSJQUͱ (SBQI2-Ͱ࣮ݱ͢Δܕ҆શͳ"1*࣮ ͕େมஸೡͳηογϣϯͱͳ͍ͬͯ·͢🙌 ຊηογϣϯͰϑϩϯτΤϯυ͔ΒόοΫΤϯυ·ͰεΩʔϚΛ௨ͯ͡ܕ͕͍͍ͯΔ͜ ͱΛલఏͱͯ͠εΩʔϚۦಈͷྲྀΕʹ͍ͭͯݟ͍͖ͯ·͢ɻ <ৄ͍͠ํ͚>্هൃදͱͷࡉ͔ͳٕज़બఆͷҧ͍
(SBQI2-4%- εΩʔϚఆٛݴޠ ΛͬͨʮεΩʔϚϑΝʔετʯͷΞϓϩʔνΛ࠾༻ (SBQI2-ίʔυੜϑϩϯτΤϯυόοΫΤϯυ(SBQI2-$PEFHFOͰ౷Ұ όοΫΤϯυͰͦΕΛ(SBQI2-:PHB্Ͱಈ͔͢ߏʹͳ͍ͬͯΔ IUUQTTQFBLFSEFDLDPNIPLBDDIBUTLBJHJ
͓ͦͷɿશ෦Λදࣔ͢Δ ΤϦΞʼڌʼ෦
type Query { areas: [Area!]! } """ΤϦΞʢྫɿീϲַ,Տޱބʣ""" type Area {
name: String! sites: [Site!]! } """ڌʢྫɿീϲַ1st,ീϲַ2ndʣ""" type Site { nth: String! rooms: [Room!]! } """෦""" type Room { Code: String! } (SBQI2-εΩʔϚΛఆٛ͢Δ • ΤϯτϦϙΠϯτΛఆٛ • ֤ΦϒδΣΫτΛఆٛ • ຊޠซه͢Δ • ϢϏΩλεݴޠͷఆٛʹͳΔ • ΦϒδΣΫτಉ࢜Λܨ͙ schema.graphql
όοΫΤϯυɿڌʹؚ·ΕΔ෦ΛऔಘͰ͖ΔΑ͏ʹ͢Δྫ • (SBQI2-$PEFHFO4FSWFS1SFTFUͰܗΛίʔυੜ import type { SiteResolvers } from
"../__generated__/types"; export const Site: SiteResolvers = { rooms: async (parent, _arg, ctx) => { // Implementation of the resolver. // // // // }, }; resolvers/Site.ts
όοΫΤϯυɿڌʹؚ·ΕΔ෦ΛऔಘͰ͖ΔΑ͏ʹ͢Δྫ • (SBQI2-$PEFHFO4FSWFS1SFTFUͰܗΛίʔυੜ import type { SiteResolvers } from
"../__generated__/types"; export const Site: SiteResolvers = { rooms: async (parent, _arg, ctx) => { // Implementation of the resolver. // // // // }, }; resolvers/Site.ts • ੜ͞Εͨܗʹରͯ͠σʔλϑΣονΛ࣮ • ͜ͷ߹σʔλϕʔεͱͷΓऔΓʹ1SJTNBΛར༻͍ͯ͠Δ return ctx.prisma.room.findMany({ where: { siteId: parent.id, }, });
ϑϩϯτΤϯυɿ෦Λදࣔ͢Δίϯϙʔωϯτͷྫ • 3FBDUίϯϙʔωϯτͷϑΝΠϧʹ ࢀর͢Δ(SBQI2-ͷσʔλఆٛ • 'SBHNFOU$PMPDBUJPOͱ͍͏ඞਢख๏ const Fragment =
graphql(` fragment RoomForCalendar on Room { code } `); type Props = { FragmentType<typeof Fragment> }; export function Room({ roomData }: Props) { const room = useFragment(Fragment, roomData); return ( <div style={roomStyle}> {room.code} </div> ); } room.tsx
ϑϩϯτΤϯυɿ෦Λදࣔ͢Δίϯϙʔωϯτͷྫ • ྫɿ෦ʹઃඋ͕͍ͨ߹ͷରԠ • มߋ͕ίϯϙʔωϯτͰ݁͢Δ✅ const Fragment = graphql(`
fragment RoomForCalendar on Room { code facility { name type } } `); type Props = { FragmentType<typeof Fragment> }; export function Room({ roomData }: Props) { const room = useFragment(Fragment, roomData); return ( <div style={roomStyle}> {room.code} {facilityIcon(room.facility.type)} {facilityLabel(room.facility.type)} </div> ); } room.tsx
͓ͦͷɿ৽͍͠αʔϏεϓϥϯͷల։ എܠɿ্ཱͪ͛ͷ։ൃͱฒߦͯ͠ɺ్த͔ΒͭͷαʔϏεϓϥϯ͕࢝ಈ
6OJPOܕΛ׆༻ͨ͠ࣄۀల։ɿεΩʔϚϨϕϧ αʔϏεϓϥϯΛ6OJPOܕͰϞσϦϯάͯ͠Ճ͍ͯ͘͠ ॳظͷεΩʔϚఆٛɿ ݱࡏͷεΩʔϚఆٛɿ union ServiceProvider = | SubscriptionProvider
| BusinessProvider | CoOwnersProvider | FullOwnersProvider | StayProvider # ৽αʔϏε # ৽αʔϏε # ৽αʔϏε union ServiceProvider = | SubscriptionProvider | BusinessProvider schema.graphql schema.graphql
6OJPOܕΛ׆༻ͨ͠ࣄۀల։ɿܕϨϕϧ มߋ͖͢ՕॴΛܕΤϥʔͰัଊ ➡मਖ਼ՕॴΛϦετΞοϓ ✅αʔϏεϓϥϯΛػಈతʹల։ ʣવͳ͕ΒυϝΠϯͷؔ৺ࣄΛεΩʔϚͱܕʹͲͷΑ͏ʹɾͲͷఔөͤ͞Δ͔ͱ͍͏υϝΠϯͷใઃܭ࠷ॏཁʹͳΓ·͢ εΩʔϚ͔Βੜ͞Εͨܕʹରͯ͠ཏνΣοΫΛॻ͍͓ͯ͘͜ͱͰɾɾɾ switch (provider.type) { case
"SubscriptionProvider": handleSubscriptionProvider(provider); case "BusinessProvider": handleBusinessProvider(provider); default: { // ৽αʔϏεΛεΩʔϚʹө͢Δͱ͜͜ͰܕΤϥʔ͕ൃੜ const _exhaustiveCheck: never = provider.type; } }
εΩʔϚͱܕʹΑΔ։ൃΛͯ͠Έͯ վΊͯΞϓϦέʔγϣϯશମΛ၆ᛌͯ͠Έ·͢ɿ ɾϑϩϯτΤϯυεΩʔϚʹج͍ͮͯΫΤϦΛൃߦ͢Δॊೈͳ։ൃ͕Ͱ͖Δ ɾόοΫΤϯυͭͷεΩʔϚΛܨׂ͙Λ༩͑ΒΕΔ͜ͱͰਫ਼ͷߴ͍࣮͕Ͱ͖Δ ಉ࣌ʹ։ൃ࣌ͱ࣮ߦ࣌ͷݕূόϥϯεͷྑ͞ʹ͍ͨ͠ͱ͜ΖͰ͢ɿ ɾܕɿ։ൃ࣌ʹ5ZQF4DSJQUʹΑΔܕνΣοΫ✅ʢϑΟʔυόοΫॏࢹʣ ɾεΩʔϚɿ։ൃ࣌ʹՃ࣮͑ͯߦ࣌ݕূ✅ʢ҆શੑॏࢹʣ
ԿΑΓεΩʔϚͱ͍͏நͷߴ͍هड़Λىʹ͢Δ͜ͱɺνʔϜʹڞ௨ݴޠΛͨΒ͠·͢ɻ ඞવతʹ$VSTPS%FWJOͳͲͷ"*ίʔσΟϯάͱൈ܈ʹ૬ੑ͕ྑ͘ͳΓ·͢ɻ ૯ͯ͡εΩʔϚۦಈͷ։ൃ୯ͳΔܕ҆શੑΛ͑ΔՁΛ࣋ͭɺͱݴ͑ΔͰ͠ΐ͏ɻ
·ͱΊ
ࠓ͓͑ͨ͜͠ͱ • εΩʔϚۦಈ'VMM4UBDL5ZQF4DSJQUͷΞʔΩςΫνϟ • (SBQI2-Λ׆༻ͯ͠ϑϩϯτΤϯυͱόοΫΤϯυʹڥքΛ࡞Δ • ϑϩϯτΤϯυͷଟ༷ԽόοΫΤϯυͷׂɾ֦ுͳͲͷൃలύλʔϯ • ϫϯϓϩηεԽɺΠϯϓϩηεԽɺϓϥοτϑΥʔϜ׆༻ͳͲͷςΫχοΫ
• εΩʔϚۦಈͰͷ։ൃ • εΩʔϚఆ͔ٛΒϑϩϯτΤϯυɾόοΫΤϯυͷ࣮·Ͱ • εΩʔϚ͔Βܕʹམͱ͠ࠐΉ͜ͱͰࣄۀల։ੑΛ֫ಘ͢Δྫ
ͷιϑτΣΞΛ5ZQF4DSJQUͰΔ ࠷ޙʹɾɾɾ ʹ࢝·ͬͨଟ͘ͷ8FCαʔϏεɺͱڞʹٕज़ɾ৫ͷεέʔϧͷ՝ʹ औΓΜͰ͖·ͨ͠ɻεΩʔϚਐతܕ͚ͷٕज़ॳະख़Ͱͨ͠ɻ ͦͯ͠ࠓɺࢲ͕ͨͪఏҊ͢ΔͷɺʮεΩʔϚͱܕΛ࣠ʹͨ͠'VMM4UBDL5ZQF4DSJQUʯͱ ͍͏۩ମతͳղܾࡦͰ͢ɻ ͜Ε୯ʹ։ൃޮͷͰͳ͘ɺ࣋ଓՄೳͰՁ͋ΔιϑτΣΞΛ࡞ΔͨΊͷຊ࣭ తͳΞϓϩʔνͷҰͭͰ͢ɻ ͥͻօ͞ΜͷݱͰࢼͯ͠Έ͍ͯͩ͘͞ʂ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ
"QQFOEJY
ٕज़ʹ͓͚Δ(SBQI2-ͷཱͪҐஔ • ݺͼग़͠ଆͷॊೈੑ͕13$ΑΓߴ͘ɺϑϩϯτΤϯυͱόοΫΤϯυͷͷڥք ͕มΘΔ ▶︎ ͜ͷ݁Ռͱͯ͠ϑϩϯτΤϯυͷల։ੑ͕ߴ͘ͳΔ • ಉ࣌ʹ࠷దԽͱͷτϨʔυΦϑ͕͋ΔͨΊɺ͜ͷதͰൺֱͯ͠બ͢Δ͜ͱʹͳΔ "1*DVTUPNJ[BUJPOTQFDUSVNUSBEFP
ff 1SPEVDUJPO3FBEZ(SBQI2-<YY>
αʔόʔαΠυʹ͓͚Δ(SBQI2-ݺͼग़͠ import { YogaLink } from "@graphql-yoga/apollo-link"; function createApolloClientForServer(...)
{ return new ApolloClient({ // มߋ͜Ε͚ͩ link: new YogaLink({ fetch: yoga.fetch, endpoint: yoga.graphqlEndpoint, }), // ... }); } ɾ"QPMMP$MJFOUͷMJOLΛมߋ͢Δ͜ͱͰΠϯϓϩηεʹͰ͖Δ
3FBM8PSME(SBQI2-4DIFNB ɾεΩʔϚΛҭ͍ͯͯ͘ͱ͜͏͍͏άϥϑ͕ग़དྷ͍ͯ͘
(SBQI2-ؔ࿈ͷ͓͢͢Ίࢿྉू • 5ZQF4DSJQUͱ(SBQI2-Ͱ࣮ݱ͢Δܕ҆શͳ"1*࣮ • IUUQT[FOOEFWVCJF@EFWBSUJDMFTBEFFFF • (SBQI2-ͷޡղSFUIJOLJOHHSBQIRM • IUUQTTQFBLFSEFDLDPNTPOBUBSESFUIJOLJOHHSBQIRM •
1SPEVDUJPO3FBEZ(SBQI2- • IUUQTCPPLQSPEVDUJPOSFBEZHSBQIRMDPN • (SBQI2-͋Δ͍3FBDUʹ͓͚Δࣗతͳσʔλऔಘʹ͍ͭͯ • IUUQTTQFBLFSEFDLDPNRVSBNZGSBHNFOUDPNQPTJUJPOPGHSBQIRM • (SBQI2-αʔόͷߏཁૉΛཧ͢Δ • IUUQTTQFBLFSEFDLDPNJ[VNJOHSBQIRMTFSWFSUFDIOPMPHZTFMFDUJPO
όοΫΤϯυͷϨΠϠϦϯά