GraphQL×TypeScriptでエモかった5つのこと.pdf

 GraphQL×TypeScriptでエモかった5つのこと.pdf

Gunmaweb #34のLTスライドです。
GraphQL、及びGraphQL×TypeScriptを組み合わせてみてエモいなぁと感じることが多かったのでそれらをまとめてみました。

71edb1d850dac3d58cb29a1b8000873f?s=128

TsukasaSekiguchi

February 02, 2019
Tweet

Transcript

  1. GraphQL×TypeScriptͰ ΤϞ͔ͬͨ5ͭͷ͜ͱ 2019/02/02 Gunma.web #34 ؔޱ ࢘

  2. ໊લ: ؔޱ࢘ SNS: GitHub: TsukasaGR Twitter: TsukasaGr NewsPicks: ؔޱ࢘ ࠲ӈͷ໏

    ࣗ෼ͷͨΊʹɺଞਓʹਚ͘͢ ࢓ࣄ: αϥϦʔϚϯ: SIerͰ৽نࣄۀ(toC޲͚ͷWebαʔϏε)։ൃ ϑϦʔϥϯε: ελʔτΞοϓͷWebΤϯδχΞ ࠷ۙ৮ͬͯΔ΋ͷ: PHP(Laravel)ɺJavascript/Typescript(Vue.js/Nuxt.js)ɺGraphQLɺDockerɺAWSɺFirebase ࣗݾ঺հ
  3. ࠓ೔࿩͢͜ͱ • GraphQLͱ͸ • GraphQLͷPros/Cons • TypeScriptͱ͸ • GraphQLΛ৮ͬͯΤϞ͔ͬͨ͜ͱ •

    GraphQL×TypeScriptΛ૊Έ߹Θͤͯ ΤϞ͔ͬͨ͜ͱ
  4. GraphQL(backend) Laravel: 5.7.24 nuwave/lighthouse: 2.6.4 mll-lab/laravel-graphql-playground: 0.3.3 GraphQL(frontend), TypeScript Nuxt.js:

    2.3.4 typescript: 3.2.2 @nuxtjs/apollo: 4.0.0-rc2.3 etc… લఏ
  5. ΤϞ͔ͬͨ5ͭͷ͜ͱ

  6. 1. ΫϥΠΞϯτ࣮ߦ؀ڥ͕ ΤϞ͍

  7. mll-lab/laravel-graphql-playground (prisma/graphql-playground)

  8. prisma/vscode-graphql

  9. 2. GraphQLͷΫΤϦ͕ ΤϞ͍

  10. ෳ਺ͷΫΤϦΛ·ͱΊͯൃߦ

  11. 3. Document as Code͕ ΤϞ͍

  12. nuwave/lighthouse

  13. 4. Code Generator͕ ΤϞ͍

  14. dotansimha/graphql-code-generator

  15. 5. ·ͩओྲྀʹͳͬͯͳ͍ͷ͕ ΤϞ͍

  16. • TypeScript͸AltJSͷσϑΝΫτʹͳΓͭͭ͋Δ͕ɺAPI͸ ·ͩ·ͩRestAPI͕ओྲྀ • ΋ͪΖΜGraphQL͸RestAPIͷ୅ସͱͯ͠Ͱͳ͘࢖͍෼͚ Δ΋ͷͩͱࢥ͏͕ɺSSKDsͳAPIͰ͋Ε͹ΤϯυϙΠϯτ ͕ҰՕॴʹ·ͱ·͍ͬͯΔͱϑϩϯτΤϯυ͕εοΩϦ͢ Δ • ͢ͰʹΤϞ͍GraphQL͕ͩɺࠓޙ͞ΒʹΤϞ͘ͳ͍ͬͯ͘

    Մೳੑ͕͋Δʂ ͞ΒʹΤϞ͘ͳΔ͔΋ʁʂ
  17. ͓·͚. ΤϞ͘ͳ͍ͱ͜Ζ

  18. • GraphQLͷΤϞ͘ͳ͍ͱ͜Ζ • TypeScriptͷΤϞ͘ͳ͍ͱ͜Ζ • Laravel×GraphQLͷΤϞ͘ͳ͍ͱ͜Ζ • Nuxt×TypeScriptͷΤϞ͘ͳ͍ͱ͜Ζ

  19. LaravelͷGraphQL ϥΠϒϥϦ͕ൃల్্ LaravelͰGraphQLΛ࢖͍౗ͯ͠Έͨ https://qiita.com/TsukasaGR/items/1a8b0020e5e83e7a46c7

  20. NuxtͷTSαϙʔτ͕·ͩऑ͍ ͕ɺઌ೔ϦϦʔε͞Εͨv2.4ͰTSαϙʔτͨ͠ͱͷ͜ͱ https://dev.to/nuxt/nuxtjs-v240-is-out-typescript-smart- prefetching-and-more-18d

  21. ͍͞͝ʹ

  22. • ࣮ࡍʹΞϓϦέʔγϣϯΛ࣮૷ͯ͠ΈΔͱҧͬͨݟ͑ํ͸͋Γͦ͏ • ٧·ͬͨ࣌ʹάάͬͯ΋ղܾࡦ͕օແ • ΫΤϦͷ8ׂ͕Resolver • CustomDirectiveɺCustomScalarͱϑϨʔϜϫʔΫͷओػೳ (DIɺORM౳)ͷ࿈ܞ͕ग़དྷͳ͍ •

    PrismaɺApollo͕ଟػೳɺϥΠϒϥϦ͕ଟ͗ͯ͢Α͘Θ͔Βͳ͍ • ΍ͬͺΓRestAPIҰຊʹ໭ͦ͏ • etc… ͦΕͰ΋஍ཕΛ౿Ήʹ஋͢ΔΤϞ͕͋͞Δʂ