Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Swift + GraphQL

2 753 vues

Publié le

Talk given at Swift Summit 2016, in San Francisco CA by Sommer Panage. Discusses how GraphQL is beneficial to mobile apps and how it can interface with Swift via up-and-coming code generation.

Publié dans : Ingénierie
  • DOWNLOAD FULL BOOKS, INTO AVAILABLE FORMAT ......................................................................................................................... ......................................................................................................................... 1.DOWNLOAD FULL. PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... 1.DOWNLOAD FULL. EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... 1.DOWNLOAD FULL. doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... 1.DOWNLOAD FULL. PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... 1.DOWNLOAD FULL. EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... 1.DOWNLOAD FULL. doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • hI why I cannot download it .....
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici

Swift + GraphQL

  1. 1. Interfacing with GraphQL in Swift Sommer Panage • @sommer 1 — Sommer Panage • @sommer • Swift Summit 2016
  2. 2. Hello! 2 — Sommer Panage • @sommer • Swift Summit 2016
  3. 3. What is GraphQL? 3 — Sommer Panage • @sommer • Swift Summit 2016
  4. 4. The GraphQL Schema type User { name: String! id: Int! email: String twitter: String } 4 — Sommer Panage • @sommer • Swift Summit 2016
  5. 5. Instead of hitting a REST endpoint like... https://mybackend.com/api/user?id=1 5 — Sommer Panage • @sommer • Swift Summit 2016
  6. 6. I write a query like... { user(id: 1) { name email twitter } } And send it to my GraphQL endpoint https://mybackend.com/graphql 6 — Sommer Panage • @sommer • Swift Summit 2016
  7. 7. And I get back a JSON response like... { "data": { "name": "Sommer Panage", "email": "sommer@panage.org", "twitter": "@sommer" } } 7 — Sommer Panage • @sommer • Swift Summit 2016
  8. 8. Why is GraphQL such a big deal for mobile? 8 — Sommer Panage • @sommer • Swift Summit 2016
  9. 9. Let's write an app 9 — Sommer Panage • @sommer • Swift Summit 2016
  10. 10. In a REST world, we'd hit this endpoint: http://swapi.co/api/people/1/ And we'd get back... 10 — Sommer Panage • @sommer • Swift Summit 2016
  11. 11. { "name": "Luke Skywalker", "height": "1.72 m", "mass": "77 Kg", "hair_color": "Blond", "skin_color": "Caucasian", "eye_color": "Blue", "birth_year": "19 BBY", "gender": "Male", "homeworld": "http://swapi.co/api/planets/1/", "films": [ "http://swapi.co/api/films/1/", "http://swapi.co/api/films/2/", "http://swapi.co/api/films/3/" ], "species": [ "http://swapi.co/api/species/1/" ], "vehicles": [ "http://swapi.co/api/vehicles/14/", "http://swapi.co/api/vehicles/30/" ], "starships": [ "http://swapi.co/api/starships/12/", "http://swapi.co/api/starships/22/" ], "created": "2014-12-09T13:50:51.644000Z", "edited": "2014-12-10T13:52:43.172000Z", "url": "http://swapi.co/api/people/1/", "image_url": "http://static.srcdn.com/wp-content/uploads/luke-skywalker-star-wars-a-new-hope.jpg" } 11 — Sommer Panage • @sommer • Swift Summit 2016
  12. 12. And then...we'd make two more calls to... http://swapi.co/api/starships/12/ and http://swapi.co/api/starships/22/ 12 — Sommer Panage • @sommer • Swift Summit 2016
  13. 13. { "name": "X-wing", "model": "T-65 X-wing", "manufacturer": "Incom Corporation", "cost_in_credits": "149999", "length": "12.5", "max_atmosphering_speed": "1050", "crew": "1", "passengers": "0", "cargo_capacity": "110", "consumables": "1 week", "hyperdrive_rating": "1.0", "MGLT": "100", "starship_class": "Starfighter", "pilots": [ "http://swapi.co/api/people/1/", "http://swapi.co/api/people/9/", "http://swapi.co/api/people/18/", "http://swapi.co/api/people/19/" ], "films": [ "http://swapi.co/api/films/3/", "http://swapi.co/api/films/2/", "http://swapi.co/api/films/1/" ], "created": "2014-12-12T11:19:05.340000Z", "edited": "2014-12-22T17:35:44.491233Z", "url": "http://swapi.co/api/starships/12/" } 13 — Sommer Panage • @sommer • Swift Summit 2016
  14. 14. { "name": "Imperial shuttle", "model": "Lambda-class T-4a shuttle", "manufacturer": "Sienar Fleet Systems", "cost_in_credits": "240000", "length": "20", "max_atmosphering_speed": "850", "crew": "6", "passengers": "20", "cargo_capacity": "80000", "consumables": "2 months", "hyperdrive_rating": "1.0", "MGLT": "50", "starship_class": "Armed government transport", "pilots": [ "http://swapi.co/api/people/1/", "http://swapi.co/api/people/13/", "http://swapi.co/api/people/14/" ], "films": [ "http://swapi.co/api/films/3/", "http://swapi.co/api/films/2/" ], "created": "2014-12-15T13:04:47.235000Z", "edited": "2014-12-22T17:35:44.795405Z", "url": "http://swapi.co/api/starships/22/" } 14 — Sommer Panage • @sommer • Swift Summit 2016
  15. 15. That's 3 calls and a whole lot of data for 1 little VC 15 — Sommer Panage • @sommer • Swift Summit 2016
  16. 16. Now in GraphQL, instead we'd write the following query: { person(personID: 1) { name, height, mass, hairColor, eyeColor, imageURL, starshipConnection { edges { node { name } } } } } 16 — Sommer Panage • @sommer • Swift Summit 2016
  17. 17. And, I'd get back exactly what I wanted! { "data": { "person": { "name": "Luke Skywalker", "height": 172, "mass": 77, "hairColor": "blond", "eyeColor": "blue", "imageURL": "http://static.srcdn.com/wp-content/uploads/luke-skywalker-star-wars-a-new-hope.jpg", "starshipConnection": { "edges": [ { "node": { "name": "X-wing" } }, { "node": { "name": "Imperial shuttle" } } ] } } } } 17 — Sommer Panage • @sommer • Swift Summit 2016
  18. 18. So, why is GraphQL such a big deal for mobile? 1. Ask and ye shall receive! 2. Fewer round trips! 3. Less client logic around data! 18 — Sommer Panage • @sommer • Swift Summit 2016
  19. 19. Wait just a minute... 19 — Sommer Panage • @sommer • Swift Summit 2016
  20. 20. Our Star Wars Character model struct SWCharacter { let name: String let heightInCm: Int let massInKg: Int let hairColorDescriptor: String let skinColorDescriptor: String let eyeColorDescriptor: String let birthYear: StarWarsUniverse.Year let gender: StarWarsUniverse.Gender let homeworld: StarWarsUniverse.Planet let films: [SWFilm] let species: [StarWarsUniverse.Species] let vehicles: [StarWarsUniverse.Vehicle] let starships: [StarWarsUniverse.Starship] let imageURL: URL? } 20 — Sommer Panage • @sommer • Swift Summit 2016
  21. 21. Our Star Wars Character model struct SWCharacter { let name: String? let heightInCm: Int? let massInKg: Int? let hairColorDescriptor: String? let skinColorDescriptor: String? let eyeColorDescriptor: String let birthYear: StarWarsUniverse.Year? let gender: StarWarsUniverse.Gender? let homeworld: StarWarsUniverse.Planet? let films: [SWFilm]? let species: [StarWarsUniverse.Species]? let vehicles: [StarWarsUniverse.Vehicle]? let starships: [StarWarsUniverse.Starship]? let imageURL: URL? } 21 — Sommer Panage • @sommer • Swift Summit 2016
  22. 22. Swift, No!!!! struct SWCharacter { let name: String? let heightInCm: Int? let massInKg: Int? let hairColorDescriptor: String? let skinColorDescriptor: String? let eyeColorDescriptor: String let birthYear: StarWarsUniverse.Year? let gender: StarWarsUniverse.Gender? let homeworld: StarWarsUniverse.Planet? let films: [SWFilm]? let species: [StarWarsUniverse.Species]? let vehicles: [StarWarsUniverse.Vehicle]? let starships: [StarWarsUniverse.Starship]? let imageURL: URL? } 22 — Sommer Panage • @sommer • Swift Summit 2016
  23. 23. 23 — Sommer Panage • @sommer • Swift Summit 2016
  24. 24. Let's model the data how we want it, not how it is → 1 View Controller → 1 Query → 1 Data Model 24 — Sommer Panage • @sommer • Swift Summit 2016
  25. 25. 25 — Sommer Panage • @sommer • Swift Summit 2016
  26. 26. query AllCharacters { allPeople { edges { node { id name homeworld { name } } } } } 26 — Sommer Panage • @sommer • Swift Summit 2016
  27. 27. struct AllCharactersData { let people: [Person] struct Person { let id: String let name: String let homeworld: Homeworld struct Homeworld { let name: String } } } 27 — Sommer Panage • @sommer • Swift Summit 2016
  28. 28. query Character($id: ID) { person (id: $id) { id height, mass, hairColor, eyeColor, imageURL, starshipConnection { edges { node { name } } } } } 28 — Sommer Panage • @sommer • Swift Summit 2016
  29. 29. struct CharacterData { struct Person { let id: String let height: Int let mass: Int let hairColor: String let eyeColor: String let imageURL: URL? let starshipConnect: [Starship] struct Starship { let name: String } } } 29 — Sommer Panage • @sommer • Swift Summit 2016
  30. 30. By having query / view- data based models, we no longer need optionals everywhere! 30 — Sommer Panage • @sommer • Swift Summit 2016
  31. 31. But our parsing code still looks like... let parsedData = try JSONSerialization.jsonObject(with: data, options: []) as! [String: Any] self.id = parsedData["id"] as! String self.name = parsedData["name"] as! String self.homeworld = Homeworld(dict: parsedData["homeworld"] as! [String : Any]) Ugh! 31 — Sommer Panage • @sommer • Swift Summit 2016
  32. 32. Code Gen! 32 — Sommer Panage • @sommer • Swift Summit 2016
  33. 33. 33 — Sommer Panage • @sommer • Swift Summit 2016
  34. 34. Apollo's iOS GraphQL Client for Swift → Compile-time safety → Inline validation errors for GraphQL → No wasted cycles on query-gen 34 — Sommer Panage • @sommer • Swift Summit 2016
  35. 35. What about...? 35 — Sommer Panage • @sommer • Swift Summit 2016
  36. 36. Versioning → "Version-Free" → Easy to test for backwards compatability 36 — Sommer Panage • @sommer • Swift Summit 2016
  37. 37. Caching 37 — Sommer Panage • @sommer • Swift Summit 2016
  38. 38. Simple Caching Query-based, not object based 38 — Sommer Panage • @sommer • Swift Summit 2016
  39. 39. Advanced Caching Flattened results, id-record mapped 39 — Sommer Panage • @sommer • Swift Summit 2016
  40. 40. Aren't you supposed to use GraphQL with React Native? 40 — Sommer Panage • @sommer • Swift Summit 2016
  41. 41. GraphQL + Swift -> GraphQL shines on mobile -> Swift gives us types and compile time safety -> React Native is new and exciting, but that comes with challenges too 41 — Sommer Panage • @sommer • Swift Summit 2016
  42. 42. In Conclusion... 42 — Sommer Panage • @sommer • Swift Summit 2016
  43. 43. Pros to GraphQL + Swift → Fewer requests for data → Getting the exact data you need → Code gen -> no janky parsing code → Models that are reflective of your views → A strongly typed backend schema 43 — Sommer Panage • @sommer • Swift Summit 2016
  44. 44. Cons to GraphQL + Swift → Not a lot of tooling yet → Best practices still emerging → Poorly defined schema becomes a big client problem → Not as good for endpoints requiring heavy logic 44 — Sommer Panage • @sommer • Swift Summit 2016
  45. 45. tldr: It's worth it! 45 — Sommer Panage • @sommer • Swift Summit 2016
  46. 46. Check out → Apollo iOS Client: Documentation and info on Apollo's awesome Swift iOS GraphQL client → 5 benefits of static GraphQL Queries: Blog post from Apollo → Bringing GraphQL to iOS: Blog post from Apollo → GraphQL First: A better way to build modern apps: Blog post from Apollo 46 — Sommer Panage • @sommer • Swift Summit 2016
  47. 47. Check out...con’t → GraphQL for mobile: Blog post from Artsy → Relay: Thinking in GraphQL: Post from FB on Caching 47 — Sommer Panage • @sommer • Swift Summit 2016
  48. 48. Thank you!! Come ask me questions about GraphQL + Swift or about Accessibility! 48 — Sommer Panage • @sommer • Swift Summit 2016
  49. 49. Credits Images GediminasTurbo Baltaduonis, Danil Polshin, Apple, Facebook, Apollo, Lucasfilm General Chorus Fitness, Apollo, Facebook 49 — Sommer Panage • @sommer • Swift Summit 2016

×