GraphQLサーバーのスキーマファースト開発を半年経て

Transcript

1. ©2019 Wantedly, Inc. GraphQLαʔόʔͷεΩʔϚϑΝʔετ։ൃΛ൒೥ܦͯ meguro.es @Wantedly, Inc 2019/10/10 Tsuyoshi Hara

2. ©2019 Wantedly, Inc. Tsuyoshi Hara Frontend Engineer @Wantedly, Inc -

   Visit Product Squad ʹॴଐ - ৽نػೳ։ൃ΍ɺطଘػೳͷϦχϡʔΞϧͳͲΛߦ͍ͬͯ·͢ɻ - ϑϩϯτΤϯυɾGraphQL αʔόʔͷ։ൃΛ͍ͯ͠·͢ - Twitter/Github: @chloe463

3. ©2019 Wantedly, Inc. Table of contents 1. લఏ஌ࣝ (GraphQLʹ͍ͭͯ) 2.

   ͜͜൒೥ͷ Product Squad ͷऔΓ૊Έ 3. εΩʔϚϑΝʔετ։ൃͰΑ͔ͬͨ͜ͱɾࠔͬͨ͜ͱ

4. ©2019 Wantedly, Inc. (SBQI2-
   ʹ͍ͭͯ

5. ©2019 Wantedly, Inc. GraphQL͸ΫΤϦݴޠ • API ͷͨΊͷΫΤϦݴޠ • σʔλͷܕ (Type)

   Λఆٛ͢Δ͜ͱ͕Ͱ͖Δ • ಛఆͷσʔλϕʔε΍σʔλετΞʹґଘ͠ͳ͍ • σʔλͷऔಘ: Query • σʔλͷ࡞੒ɾߋ৽ɾ࡟আ: Mutation GraphQLʹ͍ͭͯ

6. ©2019 Wantedly, Inc. GraphQLʹ͍ͭͯ 4DIFNB 2VFSZ %BUB

7. ©2019 Wantedly, Inc. GraphQLʹ͍ͭͯ ϦϨʔγϣϯΛ؆ܿʹهड़Ͱ͖Δ • ͋ΔϢʔβʔͷ friend ҰཡΛऔΓ͍ͨ৔߹ •

   RESTful API ͷ৔߹࠷௿2ຊͷϦΫΤετ͕ඞཁ • /user/:id ͰϢʔβʔΛ1݅औಘ • /user/:id/friends Ͱ friend ϦετΛऔಘ • GraphQL ͷ৔߹ɺ1ͭͷ Query ͰղܾͰ͖Δ • ू໿૚ͱͯ͠େ͍ʹྗΛൃشͰ͖Δ

8. ©2019 Wantedly, Inc. ͜͜൒೥ͷ1SPEVDU
   4RVBEͷऔΓ૊Έ

9. ©2019 Wantedly, Inc. Wantedly Ͱ͸ ϚΠΫϩαʔϏεԽΛਐΊ͍ͯ·͢

10. ©2019 Wantedly, Inc. • طଘػೳͷେ෯ϦχϡʔΞϧΛ࣮ࢪத • ୈҰ஄͸ืू࡞੒ը໘ͷϦχϡʔΞϧ https://www.wantedly.com/companies/wantedly/post_articles/182854 • ϞϊϦγοΫͳRailsΞϓϦέʔγϣϯΛ੾Γ่ͯ͠ϚΠΫϩαʔϏεԽ

    • ݱࡏผػೳͷϦχϡʔΞϧΛ࣮ࢪத • BFF ͱͯ͠ GraphQL αʔόʔΛಋೖ • ૿͍͑ͯ͘όοΫΤϯυͷϚΠΫϩαʔϏεͷલஈʹ GraphQL αʔόʔΛઃஔ • ϑϩϯτΤϯυ͸όοΫΤϯυͷϚΠΫϩαʔϏεΛҙࣝ͢Δ͜ͱͳ͘σʔλΛऔಘ͢Δ͜ͱ͕Ͱ͖ΔΑ͏ʹ ͜͜൒೥ͷऔΓ૊Έ

11. ©2019 Wantedly, Inc. εΩʔϚΛఆٛ͢Δͱ͜Ζ͔Β։ൃΛελʔτ • طଘػೳͷAPIͷϦΫΤετɾϨεϙϯεΛચ͍ग़͠ɺGraphQLͷεΩʔϚΛఆٛ • Resolver ͸࣮૷ͤͣɺͱΓ͋͑ͣϞοΫͷϨεϙϯεΛฦͤΔΑ͏ʹ •

    ϞοΫΛฦͤΔ͜ͱͰϑϩϯτΤϯυ͸όοΫΤϯυͷ࣮૷Λ଴ͨͣʹ࣮૷ΛਐΊΔ͜ͱ͕Ͱ͖ΔΑ͏ʹ GraphQL αʔόʔ։ൃ

12. ©2019 Wantedly, Inc. NexusΛ࢖ͬͯTypeScriptͷίʔυ͔ΒGraphQLͷεΩʔϚΛఆٛ • Nexus Λ࢖͍ίʔυ͔ΒGraphQLͷεΩʔϚͱTypeScriptͷܕΛੜ੒ • TypeScript ͷίʔυʹूதͰ͖

    GraphQLͷܕͷੈքͱTypeScriptͷܕͷੈքΛߦ͖དྷ͢Δඞཁ͕ͳ͍ Nexus Λ࢖ͬͨ GraphQL αʔόʔ։ൃ

13. ©2019 Wantedly, Inc. Nexus Λ࢖ͬͨ GraphQL αʔόʔ։ൃ NexusͰͷTypeఆٛ

14. ©2019 Wantedly, Inc. Nexus Λ࢖ͬͨ GraphQL αʔόʔ։ൃ NexusͰͷQueryఆٛ

15. ©2019 Wantedly, Inc. Nexus Λ࢖ͬͨ GraphQL αʔόʔ։ൃ ੜ੒͞ΕͨGraphQLͷεΩʔϚϑΝΠϧ

16. ©2019 Wantedly, Inc. Nexus Λ࢖ͬͨ GraphQL αʔόʔ։ൃ ੜ੒͞ΕͨTypeScriptͷܕ

17. ©2019 Wantedly, Inc. Nexus Λ࢖ͬͨ GraphQL αʔόʔ։ൃ

18. ©2019 Wantedly, Inc. όοΫΤϯυ͔ΒϑϩϯτΤϯυ·Ͱ ܕ৘ใΛอ࣋

19. ©2019 Wantedly, Inc. • APIఆ͔ٛΒΫϥΠΞϯτϑΝΠϧͱܕఆٛΛੜ੒ • όοΫΤϯυαʔόͷ Swagger / .proto

    ͔Β open-api-generator / gRPC tools Λ࢖ͬͯΫϥΠΞϯτϑΝΠϧͱܕఆٛ ϑΝΠϧΛੜ੒ • ϑϩϯτΤϯυͰ΋ Apollo Λ࢖ͬͯܕఆٛΛੜ੒ • GraphQL αʔόʔʹରͯ͠ Introspection ͱ͍͏λΠϓͷ Query ΛϦΫΤετ͢Δ͜ͱͰεΩʔϚ৘ใΛμ΢ϯϩʔυ͢ Δ͜ͱ͕Մೳ • εΩʔϚ৘ใͱιʔείʔυ಺ͷ Query / Mutation ͔ΒܕఆٛΛੜ੒ ܕ৘ใͷอ࣋

20. ©2019 Wantedly, Inc. ܕ৘ใͷอ࣋

21. ©2019 Wantedly, Inc. εΩʔϚϑΝʔετ։ൃͰΑ͔ͬͨ͜ͱɾࠔͬͨ͜ͱ

22. ©2019 Wantedly, Inc. Apollo ʹΑΓੜ੒͞ΕΔܕͷ͓͔͛Ͱ
 ϑϩϯτΤϯυͷੜ࢈ੑ͸্͕ͬͨ • MVP։ൃ࣌ɺ͸͡Ίʹ Presentational Component

    Λ storybook Λ࢖ͬͯେྔʹ։ൃ • Component ͕ἧͬͨͱ͜ΖͰ Container Component / GraphQL ͱͭͳ͗ࠐΈ • ࠷ॳ͔Βܕ৘ใΛ࢖͑ͨ͜ͱͰɺComponent ઃܭͳͲ͕͏·͍͖ͭ͘ͳ͗͜Έ΋1ਓͰ1.5೔ఔ౓Ͱ׬ྃ • εΩʔϚ͕͋Γܕੜ੒͕Ͱ͖ͨ͜ͱͰɺணख͔Β2िؒ΄ͲͰMVPΛ։ൃ͢Δ͜ͱ͕Ͱ͖ͨ εΩʔϚϑΝʔετ։ൃͰΑ͔ͬͨ͜ͱ

23. ©2019 Wantedly, Inc. εΩʔϚϑΝʔετ։ൃͰࠔͬͨ͜ͱ ᶃ GraphQLαʔόʔͷ։ൃ͕ϘτϧωοΫʹ • ։ൃମ੍: ϑϩϯτΤϯυઐ೚1໊ /

    ϑϩϯτΤϯυ + BFF 1໊ / BFF + όοΫΤϯυ 1໊ / όοΫΤϯυઐ೚1໊ • Ճ͑ͯɺ8݄9݄͸αϚʔΠϯλʔϯੜ (ϑϩϯτΤϯυ) ͕3໊ • MVP·Ͱͷ։ൃ͸ͱͯ΋εϜʔζͩͬͨ • ͕ͩ͞ΒʹػೳΛ௥Ճͯ͘͠ஈ֊Ͱܕमਖ਼͕Կ౓ͱͳ͘ൃੜ • Πϯλʔϯੜ͕ͨͪΨϯΨϯ։ൃͯ͘͠ΕΔͷ΋ഥंΛ͔͚ͨ (خ͍͠൵໐) • ܕ͕मਖ਼͞Εͳ͍ͱϑϩϯτଆͰ΋ܕੜ੒͕Ͱ͖ͣ଴ͪঢ়ଶʹ

24. ©2019 Wantedly, Inc. εΩʔϚϑΝʔετ։ൃͰࠔͬͨ͜ͱ ᶃ ܕͷमਖ਼͸ϑϩϯτΤϯυResolver ͷ։ൃ͸όοΫΤϯυ • ࣮ࡍϦΫΤετ͢ΔଆΛΑ͘஌͍ͬͯΔͷ͸ϑϩϯτΤϯυΤϯδχΞͱ͍͏͜ͱͰɺ
 Req/Res

    ͷܕमਖ਼͸ϑϩϯτΤϯυΤϯδχΞ͕୲౰ • όοΫΤϯυͷϚΠΫϩαʔϏεαʔϏεͱܨ͙෦෼ (Resolver) ͸όοΫΤϯυΤϯδχΞ͕୲౰ • ͜ΕʹΑΓϑϩϯτΤϯυଆ͕GraphQLαʔόʔͷमਖ਼Λ଴ͭ͜ͱͳ͘ਐΊΒΕΔΑ͏ʹͳͬͨ • ܕ৘ใ͑͋͞Ε͹ϞοΫΛฦ͢͜ͱ͕Ͱ͖ɺApollo ʹΑΔܕੜ੒΋Ͱ͖Δ

25. ©2019 Wantedly, Inc. εΩʔϚϑΝʔετ։ൃͰࠔͬͨ͜ͱ ᶄ ܕͷमਖ਼ʹ͔͔Δίετ͕େ͖͍ • ։ൃ͔࣌ͩΒΧδϡΞϧʹσϓϩΠͰ͖͍ͯΔ͕ϦϦʔεͨ͋͠ͱͷมߋ͸େม • มߋ͍ͨ͠΋ͷΛҰ୴

    deprecated ʹ͠ɺ৽͍͠ field type ௥ՃɺϑϩϯτଆΛमਖ਼ɺݹ͍ field Λ࡟আͱ͍ͬͨख ॱΛ౿Ήඞཁ͕͋Δ • ͏·͍͔͘ͳͯ͘ྑ͘ͳ໊͍લͷ Query ͕ੜ·Εͯ͠·ͬͨ (…V2 తͳ)

26. ©2019 Wantedly, Inc. εΩʔϚϑΝʔετ։ൃͰࠔͬͨ͜ͱ ᶄ ։ൃॳظஈ֊ͰεΩʔϚΛܾΊ͖Δͷ͕೉͍͠ • ϦχϡʔΞϧͳͷͰɺطଘͷ API Λચ͍ग़͠εΩʔϚΛܾΊ͍ͯͬͨ

    • ৽͍͠σβΠϯ্͕͕ΔલʹܾΊͨͷͰɺॳظʹܾΊ͍ͯͨ΋ͷͰ͸ରԠͰ͖ͳ͍΋ͷ͕Ͱ͖ͯͯ͠·ͬͨ • ࣍ճҎ߱ͷ TRY: νʔϜશһͰϨϏϡʔ͢ΔձΛ։͘ • ։ൃॳظஈ֊ʹ2ਓ͚ͩͰܾΊͨͱ͍͏ͷ΋Α͘ͳ͔ͬͨɺͱ͍͏൓ল͔Β • ։ൃதͷमਖ਼͸͋Δఔ౓࢓ํͳ͍͕ɺස౓͕ଟ͗ͨ͢ • υϝΠϯ஌ࣝͷ͋ΔਓɺεΩʔϚઃܭܦݧऀΛؚΊͨνʔϜશһͱڞ༗͢Δ͜ͱ͕େࣄͩͱߟ͍͑ͯΔ

27. ©2019 Wantedly, Inc. ·ͱΊ

28. ©2019 Wantedly, Inc. ·ͱΊ • Nexus΍ApolloΛ࢖ͬͨίʔυੜ੒ɾܕੜ੒͸Ғେ • ܕ͕͋Δ͜ͱʹΑΓϑϩϯτΤϯυͷੜ࢈ੑ͸͕͍͋ͬͯ Δͱײ͍ͯ͡Δ •

    εΩʔϚϑΝʔετ։ൃ͸೉͍͠

29. ©2019 Wantedly, Inc. Thank You!