GraphQL & Ember

6254dc2b7e4f26b2ab5d05c560834671?s=47 Chris Ball
February 21, 2018

GraphQL & Ember

A presentation at the Boston Ember group going over GraphQL and how to integrate it into your app.

6254dc2b7e4f26b2ab5d05c560834671?s=128

Chris Ball

February 21, 2018
Tweet

Transcript

  1. &

  2. Chris Ball cball_

  3. Disclaimers

  4. vs

  5. vs

  6. vs

  7. These are all tools to build apps.

  8. You are not your tools.

  9. What is GraphQL?

  10. A specification that enforces a schema.

  11. The schema validates
 client requests.

  12. An application layer.

  13. Gives power to
 the client.

  14. What?!

  15. Here’s a schema.

  16. None
  17. 2 Special Schema Types.

  18. Query

  19. None
  20. Mutation

  21. Variables!

  22. GraphQL Advantages

  23. Advantages ★ No more “hey can you make this endpoint


    return this now?” discussions ★ Reduce number of requests ★ Smaller payloads (return only what you need) ★ camelCase conventions ★ Client determines shape of response ★ Subscriptions / websockets built in
  24. Advantages ★ “Wrap” an existing REST API ★ Schema Stitching

    to combine multiple GQL APIs as one ★ No more thinking about requests/responses ★ Tooling: GraphiQL is amazing ★ Introspection: Client can send query to get the schema ★ Fragments
  25. GraphiQL & Introspection

  26. Ok, how can I use this in Ember?

  27. None
  28. None
  29. I was going to show examples using

  30. None
  31. None
  32. Configure Apollo

  33. Do some queries

  34. None
  35. None
  36. None
  37. None
  38. None
  39. None
  40. None
  41. How do I fetch a different org?

  42. None
  43. Cool story. How do you query 
 for multiple items?

  44. None
  45. None
  46. None
  47. Do a mutation

  48. None
  49. None
  50. Subscriptions
 are also a thing.

  51. Ember Data?

  52. None
  53. What about Tests / Mocking / Mirage?

  54. None
  55. https://github.com/bgentry/ember-apollo-client/blob/master/tests/helpers/start-pretender.js https://www.apollographql.com/docs/link/links/schema.html#Mocking

  56. Different Folder Structure?

  57. None
  58. https://github.com/bgentry/ember-apollo-client/blob/master/tests/helpers/start-pretender.js https://www.apollographql.com/docs/link/links/schema.html#Mocking

  59. Resources

  60. https://github.com/bgentry/ember-apollo-client http://graphql.org/learn/ https://www.apollographql.com/docs http://graphql.org/blog/rest-api-graphql-wrapper/ https://www.howtographql.com/ember-apollo