Upgrade to Pro — share decks privately, control downloads, hide ads and more …

活用パターンで学ぶGraphQL

 活用パターンで学ぶGraphQL

クラスメソッド年次技術イベント「Developers.IO 2020 CONNECT」 で登壇した内容です。

Acb6390b6c4b5192f40e10601b63dafc?s=128

Taewoo Kim

June 26, 2020
Tweet

Transcript

  1.  5BFXPP,JN ׆༻ύλʔϯͰֶͿ(SBQI2-

  2. ࣗݾ঺հ   5BFXPP,JN ΩϜς΢ʣ "84ࣄۀຊ෦ίϯαϧςΟϯά෦ॴଐ ೥݄ೖࣾɺ೔ຊޠྺ೥ "1/"845PQ&OHJOFFSTʹ౰બ Ϋϥεϝιουͷ࠷ॳͷؖࠃਓΤϯδχΞ ޷͖ͳ"84αʔϏεɿ"QQ4ZODɺ"NQMJGZ

  3. ηογϣϯ֓ཁ   ͜ͷηογϣϯͰ࿩͞ͳ͍͜ͱ (SBQI2-ͷจ๏ (SBQI2-εΩʔϚσβΠϯͷϕετϓϥΫςΟε ίʔυϨϕϧͰͷϕετϓϥΫςΟε (SBQI2-Λ࢖ͬͨೝূɾηΩϡϦςΟ (SBQI2-ϞχλϦϯάɾ࠷దԽ౳

  4. ηογϣϯ֓ཁ   ͜ͷηογϣϯͰ࿩͢͜ͱ (SBQI2-ͷొ৔എܠͱجૅ֓೦ (SBQI2-ΞʔΩςΫνϟʔύλʔϯ #BDLFOE'PS'SPOUFOE 3FBMUJNF"SDIJUFDUVSF 5ISFF'BDUPS"QQ (SBQI2-ͷ$234ύλʔϯ

    
  5.   GraphQLͷ֓೦

  6. (SBQI2-ͷ֓೦ɿొ৔എܠ   REST API Λ։ൃ͢ΔνʔϜͰ͸ ΄ͱΜͲಉ͡໰୊ͱઓ͏

  7. (SBQI2-ͷ֓೦ɿొ৔എܠ   ྫ͑͹ɺҎԼͷ"1*͕͋ͬͨͱ͢Δ (&5BQJVTFST

  8. (SBQI2-ͷ֓೦ɿొ৔എܠ   ϖʔδωʔγϣϯ͸౰ͨΓલ͔ͩΒɺ͜͏ͳΔ (&5BQJVTFST QBHF@OVN

  9. (SBQI2-ͷ֓೦ɿొ৔എܠ   ཁ͕݅૿͑ͯɺϞόΠϧͱ΢ΣϒΛಉ࣌ʹαϙʔτ͢Δ ͜ͱʹͳΔ (&5BQJVTFST QBHF@OVNQMBUGPSNNPCJMF (&5BQJVTFST QBHF@OVNQMBUGPSNXFC

  10. (SBQI2-ͷ֓೦ɿొ৔എܠ   ϦΫΤετΛૹΔଆͷը໘ߏ੒ʹΑΓɺϨεϙϯεͷσʔ λͷछྨ͕ҟͳΔ (&5BQJVTFST QBHF@OVNQMBUGPSNNPCJMFUZQFQMBZFS@MJTU (&5BQJVTFST QBHF@OVNQMBUGPSNNPCJMFUZQFDIBUUJOH@SPPN (&5BQJVTFST

    QBHF@OVNQMBUGPSNXFCUZQFVTFS@NBOBHFS
  11. (SBQI2-ͷ֓೦ɿొ৔എܠ   όοΫΤϯυଆͷAPIؔ਺Ұ͚ͭͩͰ ίʔυ͕਺ඦϥΠϯʹͳΔ ॏෳίʔυ͕ଟ͘ͳͬͯޮ཰͕Α͘ͳ͍

  12. (SBQI2-ͷ֓೦ɿొ৔എܠ   ϝϯςφϯε͕ݫ͘͠ͳΔ͔Βɺ࠷ॳ͔ΒඞཁͳϑΟʔ ϧυͷΈϦΫΤετ͢Δ (&5BQJVTFST QBHF@OVNpFMETBDDPVOU*E  OJDLOBNF JNBHF

    X@ I@ NPEF (&5BQJVTFST QBHF@OVNpFMETBDDPVOU*E  OJDLOBNF CJSUI JOUFSFTUT JNBHF X@ I@ NPEF JODMVEFGSJFOE@MJTU
  13. (SBQI2-ͷ֓೦ɿొ৔എܠ   όοΫΤϯυଆ͸ͪΐͬͱָʹͳΔ

  14. (SBQI2-ͷ֓೦ɿొ৔എܠ   ͔͠͠ɺΫϥΠΞϯτଆͰඞཁͱ͢Δ ෳࡶͳAPIΛઃܭ͢Δ͜ͱ͸ͱͯ΋೉͍͠ Θ͚͕෼͔Βͳ͍APIʹͳΔ

  15. (SBQI2-ͷ֓೦ɿొ৔എܠ   ͔͠͠ɺϑϩϯτΤϯυଆͰ͸ APIΛཧղͮ͠Β͘ͳΔ ΋͏Θ͚͕Θ͔Βͳ͍APIʹͳΔ (&5BQJVTFST QBHF@OVNpFMETBDDPVOU*E  OJDLOBNF

    JNBHF X@ I@ NPEF (&5BQJVTFST QBHF@OVNpFMETBDDPVOU*E  OJDLOBNF CJSUI JOUFSFTUT JNBHF X@ I@ NPEF JODMVEFGSJFOE@MJTU
  16. (SBQI2-ͷ֓೦ɿ04'"ʢ0OF4J[F'JUT"MMʣ   04'" 0OF4J[F'JUT"MM ໰୊ ݩʑ͸ҰͭͷϢʔζέʔεʹ࠷దԽ͞ΕΔΑ͏ʹઃܭ͞Ε͕ͨɺ ͲΜͲΜ"1*͕େ͖͘ͳΓɺଟ͘ͷϢʔζέʔεʹ΋౴͑ΔΑ͏ ʹͳͬͯɺϝϯςφϯε΍௥Ճػೳͷ֦ு͕ݫ͘͠ͳΔ

  17. (SBQI2-ͷ֓೦ɿ5"%"   2015೥9݄ɺFacebook ΑΓ GraphQL ͕ެࣜʹެ։͞Ε·ͨ͠ʂ

  18. (SBQI2-ͷ֓೦ɿTBNQMFSFRSFTQ   query { users { accountId name imageUrl

    } } { “data”: { “accountId”: “twkiiim”, “name”: “Taewoo Kim”, “imageUrl”: “…..” } } Request Response
  19. (SBQI2-ͷ֓೦ɿλΠϓʢ5ZQFʣ   (SBQI2-͸λΠϓγεςϜ type User { id: ID! accountId:

    String! name: String! imageUrl: String address: Address } type Address { zipcode: String! city: String! } type Chatroom { id: ID! users: [User!]! createdAt: DateTime! }
  20. (SBQI2-ͷ֓೦ɿΫΤϦʢ2VFSZ   σʔλΛऔಘ͢Δ query { user(id: 13) { accountId

    name address { city } } }
  21. (SBQI2-ͷ֓೦ɿϛϡʔςʔγϣϯʢ.VUBUJPO   σʔλΛૢ࡞͢Δ σʔλͷੜ੒ɾมߋɾ࡟আ mutation { createUser(input: { name:

    “Taewoo Kim”, zipcode: “000-0000”, city: “Tokyo” }) { id } }
  22. (SBQI2-ͷ֓೦ɿαϒεΫϦϓγϣϯʢ4VCTDSJQUJPO   σʔλΛߪಡ͢Δ subscription { onCreateUser { id name

    address { zipcode city } } }
  23. (SBQI2-ͷ֓೦ɿ·ͱΊ   (SBQI2-ͷࡾͭͷΦϖϨʔγϣϯ ΫΤϦʢ2VFSZʣ ϛϡʔςʔγϣϯʢ.VUBUJPOʣ αϒεΫϦϓγϣϯʢ4VCTDSJQUJPOʣ ͜ͷࡾͭͷΦϖϨʔγϣϯʹΑΓɺ༷ʑͳύλʔϯ͕ߟ ͑ΒΕ·͢ʂ

  24.   GraphQLΞʔΩςΫνϟʔύλʔϯ

  25. (SBQI2-ύλʔϯɿ#'' #BDLFOE'PS'SPOUFOE   Backend-For-Frontend ύλʔϯ

  26. (SBQI2-ύλʔϯɿ#'' #BDLFOE'PS'SPOUFOE   (SBQI2-લͷ΄ͱΜͲͷ"1* αʔό͸ࠨଆͷΑ͏ͳߏ੒ ϓϥοτϑΥʔϜຖʹ༷ʑͳଟ͘ͷ ϢʔζέʔεΛͨͩҰ͚ͭͩͷ"1* αʔόͰશͯॲཧͤ͞Δߏ੒ 04'"ʢ0OF4J[F'JUT"MMʣ໰୊͕͋Δ

    ͨΊɺن໛͕େ͖͘ͳΕ͹ͳΔ΄Ͳɺޮ ཰͕ٸܹʹԼ͕Δ
  27. (SBQI2-ύλʔϯɿ#'' #BDLFOE'PS'SPOUFOE  

  28. (SBQI2-ύλʔϯɿ#'' #BDLFOE'PS'SPOUFOE   ֤ϓϥοτϑΥʔϜʹ߹Θͤͯ"1*αʔόΛ෼͚Δઓུ ϓϥοτϑΥʔϜຖʹָʹΧελϚΠζͰ͖ΔͷͰྑ͍ʂ ಉ͡ػೳΛߦ͏ίʔυ͕ͦΕͧΕͷ"1*αʔόͷίʔυʹଘࡏ ͢ΔͷͰίʔυͷॏෳ͕ଟ͘ͳͬͨΓ͢Δ໰୊ͷͨΊɺ௥Ճͷ ޻਺͕͔͔Δ

  29. (SBQI2-ύλʔϯɿ#'' #BDLFOE'PS'SPOUFOE  

  30. (SBQI2-ύλʔϯɿ#'' #BDLFOE'PS'SPOUFOE   γϯάϧ(SBQI2-"1*αʔόͰ#''͕Ͱ͖Δʁ ΫϥΠΞϯτଆͰඞཁͳϑΟʔϧυΛ௚઀બΜͰϦΫΤετΛ ૹΔ͔ΒɺϓϥοτϑΥʔϜຖʹϖΠϩʔυ࠷దԽ͕ࣗવʹຬ ͨ͞ΕΔ

  31. (SBQI2-ύλʔϯɿ#'' #BDLFOE'PS'SPOUFOE   ͔͠͠ʂʂ ·ͨ04'"໰୊͕ൃੜ͢ΔՄೳੑ΋͋Δ ϖΠϩʔυɺͭ·Γɺσʔλͷදݱͱ͍͏؍఺Ͱ͸γϯάϧ(SBQI2- "1*͚ͩͰશવྑ͍͚ͲɺϓϥοτϑΥʔϜຖͷϢʔβೝূɺΩϟογ ϯά౳Λߟ͑ͯΈΔͱɺ΍͸Γ"1*αʔό͸෼͚ͨํ͕ྑ͍ ҰํɺϖΠϩʔυͷΧελϚΠζͷΈ͕ཁ݅Ͱ͋Ε͹ɺγϯάϧ

    (SBQI2-"1*Ͱ#''͢Δ͜ͱ΋શવ͋Γ
  32. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   Realtime Architecture ύλʔϯ

  33. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   ͳͥ(SBQI2-ͱϦΞϧλΠϜΛ૊Έ߹ΘͤΔͷ͔ʁ ϦΞϧλΠϜΞʔΩςΫνϟʔ͸ιέοτͰ΋࣮૷ग़དྷΔ (SBQI2-Λ࢖͏ͱλΠϓγεςϜͷ͓ӄͰߋʹޮ཰తͳ࣮૷͕ग़དྷΔ

  34. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   αϒεΫϦϓγϣϯʢ4VCTDSJQUJPOʣ (SBQI2-ͷΦϖϨʔγϣϯͰ͋ΔαϒεΫϦϓγϣϯΛ࢖͏ ͜ͱͰ΄ͱΜͲͷϦΞϧλΠϜαʔϏεͷ࣮૷͕؆୯ʹͳΔ σʔλܗࣜʢλΠϓʣΛఆٛ͢Δ͚ͩͰϦΞϧλΠϜػೳ͕࢖͑Δɿ "QQ4ZODɺ)BTVSBͷΑ͏ͳαʔϏεͷ͓ӄͰόοΫΤϯυଆͷ࣮૷ ͷͨΊͷखؒΛ͔͚ͣʹϦΞϧλΠϜཁ݅ͷ࣮૷͕Մೳʹͳͬͨʂ

  35. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   https://youtu.be/kuTyxcjqeUk ஫จαʔϏεDEMO

  36. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   ϦΞϧλΠϜػೳͷ ͨΊ"QQ4ZODΛ࢖ͬ ͨαϯϓϧͷߏ੒ ஫จαʔϏεͷॲཧΠ ϕϯτΛΞυϛϯଆͷ ը໘ʹϦΞϧλΠϜͰ දࣔͯ͘͠ΕΔγφϦ

    Φ
  37. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   https://youtu.be/ZujdsxSRt48 ྫʣApollo + Hasura

  38. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   "84"QQ4ZOD "84ͷϚωʔδυ(SBQI2-αʔϏεʢαʔόʔϨεʣ εΩʔϚΛఆ͓͚ٛͯͩ͘͠ͰউखʹαϒεΫϦϓγϣϯػೳ͕࢖͑Δ

  39. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   AppSync ͷ subscription Λ࢖ͬͨྫ

  40. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   ϒϩάॻ͍ͯ·͢ʂ

  41. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   https://dev.classmethod.jp/articles/serverless-for-order-system-jawsdays2020/

  42. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   https://dev.classmethod.jp/articles/appsync-for-realtime-communication-akiba-aws-15/

  43. (SBQI2-ύλʔϯɿ3FBMUJNF"SDIJUFDUVSF   https://dev.classmethod.jp/articles/relay-re-introduction-2019-appsync/

  44. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   Three Factor App ύλʔϯ

  45. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   )BTVSB͞Μ͕ఏҊͨ͠ϞμʔϯϑϧελοΫΞϓϦέʔ γϣϯͷΞʔΩςΫνϟʔ ϦΞϧλΠϜ(SBQI2- ϦϥΠΞϏϦςΟʔͷͨΊͷΠϕϯτॲཧ ඇಉظαʔόʔϨε

  46. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   https://3factor.app/ 1. ϦΞϧλΠϜGraphQL 2. ϦϥΠΞϏϦςΟͷͨΊͷΠϕϯτॲཧ 3. ඇಉظαʔόʔϨε

  47. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   ϦΞϧλΠϜ(SBQI2- w ͙͢ϑΟʔυόοΫՄೳ w (SBQI2-ͷαϒεΫϦϓγϣϯʹ࣮ͯ૷͞ΕΔ

  48. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   ϦϥΠΞϏϦςΟʔͷͨΊͷΠϕϯτॲཧ w (SBQI2-ϛϡʔςʔγϣϯͷ௕͍ॲཧΛ଴ͨͣʹɺ؆୯ʹ ॲཧͰ͖ΔΦϖϨʔγϣϯʢΠϕϯτΛੜ੒͢Δ͜ͱʣΛ ߦ͏ w Πϕϯτ͸গͳ͘ͱ΋ճ͸ඞͣର৅αʔϏεʹ఻ΘΔ

  49. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   ඇಉظαʔόʔϨε w ֤ϚΠΫϩαʔϏε͸αʔόʔϨεͰ࣮૷͞Εͯ͋Δ w ֤αʔϏε͸ΠϕϯτετΞ͔ΒΠϕϯτΛड͚෇͚ͯॲཧ ͢Δ w

    ಉ༷ͷΠϕϯτ͸Կճॲཧͯ͠΋ಉ͡ঢ়ଶʹͳΔΑ͏ʹ࣮ ૷͢Δʢ*EFNQPUFOUʣ w Πϕϯτͷॱ൪ʹӨڹΛड͚ͳ͍
  50. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   https://3factor.app/ 1. ϦΞϧλΠϜGraphQL 2. ϦϥΠΞϏϦςΟͷͨΊͷΠϕϯτॲཧ 3. ඇಉظαʔόʔϨε

  51. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   https://3factor.app/ 1. ϦΞϧλΠϜGraphQL 2. ϦϥΠΞϏϦςΟͷͨΊͷΠϕϯτॲཧ 3. ඇಉظαʔόʔϨε

    $234ύλʔϯͱ͸ʁ w $PNNBOE2VFSZ3FTQPOTJCJMJUZ4FHSFHBUJPOͷུޠ w ΫΤϦͱϛϡʔςʔγϣϯΛ෼཭ͯ͠ߟ͑ΔΞϓϩʔν w 5ISFF'BDUPS"QQ͸(SBQI2-Ͱ$234ύλʔϯΛ ࣮૷͢ΔͨΊͷํ๏
  52. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   ΫΤϦ͸(SBQI2-ͷॲཧͦͷ··Ͱ0, ϛϡʔςʔγϣϯ͸ΠϕϯτΛൃੜ͙ͯ͢͠ϨεϙϯεΛฦ͢

  53. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   ϛϡʔςʔγϣϯΑΓΠϕϯτ͕ੜ੒͞Εͨ৔߹ɺ Πϕϯτ͸֘౰͢ΔαʔϏεʹૹΒΕΔʢΠϕϯτϧʔςΟϯάʣ

  54. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   ૹΒΕͨΠϕϯτ͸ΠϕϯτετΞʹอଘ͞ΕΔ ˠɹඇಉظͰॲཧ͞ΕΔ

  55. (SBQI2-ύλʔϯɿ5ISFF'BDUPS"QQ   ඇಉظͰॲཧ͞ΕͨΠϕϯτʢݩͷϛϡʔςʔγϣϯʣʹΑΓɺ αϒεΫϦϓγϣϯ͕τϦΨʔ͞ΕΔ

  56.   ·ͱΊ

  57. ·ͱΊ   (SBQI2-ͷొ৔എܠʹ͍ͭͯઆ໌͠·ͨ͠ (SBQI2-ͷ̏ͭͷΦϖϨʔγϣϯʹ͍ͭͯઆ໌͠·͠ ͨ (SBQI2-ΞʔΩςΫνϟʔΛઃܭ͢ΔࡍʹࢀߟʹͳΕ ΔΞʔΩςΫνϟʔͱߟ͑ํΛ঺հ͠·ͨ͠

  58. None