データの可視化とGraphQLを学ぶモチベーション

NINNO Tech Fest #2
データの可視化とGraphQLを学ぶモチベーション

Transcript

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

   View Slide

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

   View Slide

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

   View Slide

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

   View Slide

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

   View Slide

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

   View Slide

7. View Slide

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

   View Slide

9. RestAPI
   

   View Slide

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

    View Slide

11. GraphQL
    

    View Slide

12. GraphQL ͱ͸
    ͬ͘͟Γݴ͏ͱ
    ᶃ GraphQL ͸ΫϥΠΞϯτ͕ඞཁͳσʔλΛ API ͔ΒϑΣον͢ΔͨΊʹ
    

    ઃܭ͞Εͨݴޠ
    ᶄ GraphQL Λ࢖༻͢ΔͱɺΫϥΠΞϯτ͸ όοΫΤϯυ API ͔Β
    

    ඞཁͳσʔλͷܕͱγΣΠϓΛऔಘՄೳ
    ᶅ GraphQL Ͱ͸ɺͲΜͳλΠϓͷϦΫΤετͰ΋ɺ
    

    ΫϥΠΞϯτ ΞϓϦέʔγϣϯ͕ݺͼग़͢ΤϯυϙΠϯτ͸ 1 ͚ͭͩ
    ᶆ GraphQL ͸ SQL ͱΑ͘ࣅ͍ͯ·͕͢ɺϑϩϯτΤϯυͰػೳ͢Δ
    

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide