Tweet
Tweet

Slide 1

Slide 1 text

NINNO Tech Fest #2 2021.10.22 גࣜձࣾKUNO ໦Լതو σʔλͷՄࢹԽͱGraphQLΛֶͿϞνϕʔγϣϯ

Slide 2

Slide 2 text

Self Introduction Hiroki.Kinoshita גࣜձࣾKUNO ਂ૚ֶशͱΫϥ΢υΛۦ࢖͢ΔDXاۀ Front Engineer / Designer Peacock Engineer Group ( PEG ) Organizer Twitter: @kinocoboy2

Slide 3

Slide 3 text

ͳͥσʔλΛՄࢹԽΛ͢Δͷ͔

Slide 4

Slide 4 text

݁࿦ɺϝϦοτ͕ଟ͍͔Β σʔλͷՄࢹԽΛ͢Δ͜ͱͷϝϦοτ ᶃ ؾ͚ͮΔ ᶄ ൑அͰ͖Δ ᶅ Ԡ༻Ͱ͖Δ ᶆ etc…

Slide 5

Slide 5 text

σʔλͷՄࢹԽΛߦ͏ͨΊʹେࣄͳ͜ͱ ᶃ Ӿཡऀͷχʔζʹ߹Θͤͯ࡞੒͢Δ Ӿཡऀ͕ݟͯΘ͔Βͳ͍ ৘ใաଟͰٯʹࠞཚΛট͘ ᶄ σʔλͷҙຯΛਂ͘ཧղ͢Δ ͳΜͷҙຯΛ࣋ͭࢦඪͳͷ͔Λ͔ͬ͠Γ೺Ѳ͢Δඞཁ͕͋Δ ؒҧͬͨσʔλΛूΊͯ͠·͏ɾҙຯΛؒҧ͑Δ

Slide 6

Slide 6 text

Ձ஋͋ΔՄࢹԽΛ͢ΔͨΊʹ ᶃ ࣮ݱ͍ͨ͠΋ͷͷݴޠԽΛపఈతʹߦ͏ υϝΠϯۦಈઃܭ΍ϢʔβʔετʔϦʔϚοϐϯάɺϞσϦϯάͳͲ৭ʑ࿩୊ʹ ͳΔ΋ͷ͕ଟ͘ͳ͍ͬͯΔɻ ᶄ ͱʹ͔͘ࢼߦࡨޡ͠࠷దղΛಈ͖ͳ͕Βݟ͚ͭΔέʔε͕ଟ͍ ᶅ ํ޲స׵͸౰ͨΓલͷΑ͏ʹى͖Δ΋ͷ 👆 ͜Ε͕ͱʹ͔͘Τά͍

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

ΫϥΠΞϯτ։ൃ͕ਏ͗͢Δ

Slide 9

Slide 9 text

RestAPI

Slide 10

Slide 10 text

REST API ͩͱɺͳͥΫϥΠΞϯτ͕ਏ͍͔ ᶃ API ଆͷ ΠϯλʔϑΣʔε ͕ ֓೦ͷมԽʹΑͬͯॊೈʹมಈ͢Δ ΠϯλʔϑΣʔε ͕มԽ͢ΔͨͼʹɺΫϥΠΞϯτଆͷ࣮૷͕ൃੜ ΠϯλʔϑΣʔε͕ఏڙ͞ΕΔ·ͰɺΫϥΠΞϯτ͸Կ΋Ͱ͖ͳ ͍ ᶄ ϑϩϯτଆͷ ը໘෦඼ ΁ͷ߲໨௥Ճ΋͋Δ ΠϯλʔϑΣʔεमਖ਼ґཔΛ͢Δඞཁ͕͋Δ ΫϥΠΞϯτ͚ͩͰ߲໨௥Ճ͕׬݁͠ͳ͍

Slide 11

Slide 11 text

GraphQL

Slide 12

Slide 12 text

GraphQL ͱ͸ ͬ͘͟Γݴ͏ͱ ᶃ GraphQL ͸ΫϥΠΞϯτ͕ඞཁͳσʔλΛ API ͔ΒϑΣον͢ΔͨΊʹ 
 ઃܭ͞Εͨݴޠ ᶄ GraphQL Λ࢖༻͢ΔͱɺΫϥΠΞϯτ͸ όοΫΤϯυ API ͔Β 
 ඞཁͳσʔλͷܕͱγΣΠϓΛऔಘՄೳ ᶅ GraphQL Ͱ͸ɺͲΜͳλΠϓͷϦΫΤετͰ΋ɺ 
 ΫϥΠΞϯτ ΞϓϦέʔγϣϯ͕ݺͼग़͢ΤϯυϙΠϯτ͸ 1 ͚ͭͩ ᶆ GraphQL ͸ SQL ͱΑ͘ࣅ͍ͯ·͕͢ɺϑϩϯτΤϯυͰػೳ͢Δ

Slide 13

Slide 13 text

GraphQL ͱ͸ ୺తʹ͍͏ͱɺΫϥΠΞϯτ։ൃ ͱ όοΫΤϯυ։ൃͷ෼཭Λ໨త ͱ͍ͯ͠Δɻ ΤϯυϙΠϯτ͕̍ͭఏڙ͞ΕΕ͹ɺΫϥΠΞϯτଆ͕ཉ͍͠৘ใ Λࣗ༝ʹҾ͖ग़͠ͳ͕Β։ൃ͢Δ͜ͱ͕Մೳɻ SQLΛΫϥΠΞϯτଆ͕ॻ͍ͯɺόοΫΤϯυʹ࣮ߦͤ͞ΔΠϝʔδ

Slide 14

Slide 14 text

·ͱΊ ᶃ ΤϯδχΞ͸ೲ඼෺ΛσϦόϦʔ͢ΔͷͰ͸ͳ͘ɺೲ඼෺ͰಘΒΕΔՁ஋ΛσϦό Ϧʔ͢ΔଘࡏʹͳΔ ᶄ Ձ஋ΛσϦόϦʔ͢Δ৔߹ɺDDD΍ϞσϦϯάɺϢʔβʔετʔϦʔϚοϐϯάͳͲ ͷ໨తۦಈઃܭ͕ඞཁʹͳͬͯ͘Δɻ ᶅ ໨తۦಈઃܭͷ৔߹ɺैདྷͷRestAPI ͱ ΫϥΠΞϯτͷ૊Έ߹ΘͤͩͱΫϥΠΞϯτ ։ൃ͕ਏ͍ɻ(ࡾॏ;Γ͜ʣ ᶆ ͦͷͨΊʹɺΫϥΠΞϯτͱRestAPIΛ෼཭Ͱ͖Δ GraphQL ͸໨తۦಈઃܭʹ͸༗ ޮɻ ᶇ ࢼߦࡨޡͰ͖ΔͷͰɺσʔλΛϢʔβʔͷχʔζʹ߹ΘͤͯՄࢹԽͰ͖ΔΑ͏ʹͳ Δɻ

Slide 15

Slide 15 text

GraphQLɺ͋Γ͔΋ͳʔ ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠