GraphQL vs REST API - Kto wygra?

Co to jest GraphQL i czym różni się od REST API?
Czy warto w ogóle uczyć się GraphQL?
Kiedy warto używać jednego lub drugiego?
Odpowiedzi na te pytania znajdziesz w tej prezentacji!

Transcript

1. GRAPHQL VS REST API KTO WYGRA?
2. KIM JESTEM? ▸ Michał Taszycki (@mehowte) ▸ 16 lat doświadczenia w programowaniu ▸ Twórca programów szkoleniowych ▸ GraphQL Mastery ▸ Kurs Reacta ▸ Organizator Festiwalu React.js i GraphQL
3. CO TO JEST REST API?
4. CO TO JEST REST API? 1. Ścisła specyfikacja architektury API serwera
5. CO TO JEST REST API? 1. Ścisła specyfikacja architektury API serwera 2. Potoczna nazwa wszystkich API, które zwraca JSON ;)
6. SERWER MA RÓŻNE ZASOBY • Książki •Autorzy •Użytkownicy •Egzemplarze książek
7. ZASOBY MAJĄ OPERACJE • Książki (pobierz listę, pobierz detale) •Autorzy (pobierz listę, pobierz detale) •Użytkownicy (zaloguj, edytuj, pobierz listę) •Egzemplarze książek (wypożycz, oddaj)
8. OPERACJE MAJĄ METODĘ HTTP I URL • GET example.com/books (pobierz listę książek) •GET example.com/books/32 (pobierz szczegóły książki o id 32)
9. OPERACJE MAJĄ METODĘ HTTP I URL • POST example.com/users (dodaj użytkownika) •PUT lub PATCH example.com/users/44 (uaktualnij użytkownika o id 44) •PUT lub PATCH example.com/users/45 (usuń użytkownika o id 45)
10. OPERACJE MAJĄ METODĘ HTTP I URL • POST example.com/users (dodaj użytkownika) •PUT lub PATCH example.com/users/44 (uaktualnij użytkownika o id 44) •DELETE example.com/users/45 (usuń użytkownika o id 45)
11. TO DZIAŁA W OPERACJACH CRUD •POST tworzy •GET pobiera bez modyfikacji •PUT lub PATCH uaktualnia •DELETE usuwa CREATE READ UPDATE DELETE
12. W NIETYPOWYCH OPERACJACH JEST TRUDNIEJ • PUT example.com/login (zaloguj użytkownika - modyfikacja użytkownika) •PUT example.com/logout (wyloguj użytkownika - modyfikacja użytkownika)
13. W NIETYPOWYCH OPERACJACH JEST TRUDNIEJ • POST example.com/session (zaloguj użytkownika - stwórz sesję) •DELETE example.com/session (wyloguj użytkownika - usuń sesję)
14. • PUT example.com/users/44/book-copies/12?borrow (wypożycz od użytkownika 44 egzemplarz książki 12 zmodyfikuj zasób egzemplarza) •PUT example.com/users/44/book-copies/12?return (oddaj użytkownikowi 44 egzemplarz książki 12 zmodyfikuj zasób egzemplarza) W NIETYPOWYCH OPERACJACH JEST TRUDNIEJ
15. • POST example.com/book-rentals (wypożycz egzemplarz książki - stwórz zasób wypożyczenia) •DELETE example.com/book-rentals (oddaj egzemplarz książki - usuń zasób wypożyczenia) W NIETYPOWYCH OPERACJACH JEST TRUDNIEJ
16. 1. Nie wszystko jest ustandaryzowane 2. Overfetching 3. Underfetching 4. Dużo zapytań 5. Dokumentacja? PROBLEMY Z REST API
17. OVERFETCHING
18. 1. Wypisz listę książek - tylko id i tytuły OVERFETCHING
19. 1. Wypisz listę książek - tylko id i tytuły 2. Z API przychodzi za dużo danych (ISBN, opis, pierwszy rozdział, …) OVERFETCHING
20. 1. Wypisz listę książek - tylko id i tytuły 2. Z API przychodzi za dużo danych (ISBN, opis, pierwszy rozdział, …) 3. Dodaj parametr do url? (GET example.com/books?only=title,id) OVERFETCHING
21. 1. Wypisz listę książek - tylko id i tytuły 2. Z API przychodzi za dużo danych (ISBN, opis, pierwszy rozdział, …) 3. Dodaj parametr do url? (GET example.com/books?only=title,id) 4. To nie jest STANDARD :( OVERFETCHING
22. UNDERFETCHING
23. 1. Wypisz listę książek - tytuł książki i nazwisko autora UNDERFETCHING
24. 1. Wypisz listę książek - tytuł książki i nazwisko autora 2. GET example.com/books?only=id,title,author_id UNDERFETCHING
25. 1. Wypisz listę książek - tytuł książki i nazwisko autora 2. GET example.com/books?only=id,title,author_id 3. Dla każdego ID autora (GET example.com/authors/<author_id> ) UNDERFETCHING
26. 1. Wypisz listę książek - tytuł książki i nazwisko autora 2. GET example.com/books?only=id,title,author_id 3. Dla każdego ID autora (GET example.com/authors/<author_id> ) 4. Problem N+1 i overfetching dla autorów. UNDERFETCHING
27. ZA DUŻO ZAPYTAŃ
28. 1. Wyświetl dashboard w aplikacji ZA DUŻO ZAPYTAŃ
29. 1. Wyświetl dashboard w aplikacji 2. GET example.com/users/42 ZA DUŻO ZAPYTAŃ
30. 1. Wyświetl dashboard w aplikacji 2. GET example.com/users/42 3. GET example.com/users/42/books ZA DUŻO ZAPYTAŃ
31. 1. Wyświetl dashboard w aplikacji 2. GET example.com/users/42 3. GET example.com/users/42/books 4. GET example.com/users/42/authors?favorite=true ZA DUŻO ZAPYTAŃ
32. 1. Wyświetl dashboard w aplikacji 2. GET example.com/users/42 3. GET example.com/users/42/books 4. GET example.com/users/42/authors?favorite=true 5. GET example.com/book-copies?borrowedAt=today ZA DUŻO ZAPYTAŃ
33. 1. Wyświetl dashboard w aplikacji 2. GET example.com/users/42 3. GET example.com/users/42/books 4. GET example.com/users/42/authors?favorite=true 5. GET example.com/book-copies?borrowedAt=today 6. GET example.com/quotes/random ZA DUŻO ZAPYTAŃ
34. 1. Wyświetl dashboard w aplikacji 2. GET example.com/users/42 3. GET example.com/users/42/books 4. GET example.com/users/42/authors?favorite=true 5. GET example.com/book-copies?borrowedAt=today 6. GET example.com/quotes/random 7. GET example.com/weather-forecast ZA DUŻO ZAPYTAŃ
35. OK… A GRAPHQL?
36. 1. Ścisła specyfikacja API klienta i serwera OK… A GRAPHQL?
37. 1. Ścisła specyfikacja API klienta i serwera 2. Którą WSZYSCY respektują! OK… A GRAPHQL?
38. GRAPHQL W PIGUŁCE
39. 1. Jeden endpoint GRAPHQL W PIGUŁCE
40. 1. Jeden endpoint 2. Zwykle POST example.com/graphql GRAPHQL W PIGUŁCE
41. 1. Jeden endpoint 2. Zwykle POST example.com/graphql 3. Serwer definiuje schemat danych GRAPHQL W PIGUŁCE
42. 1. Jeden endpoint 2. Zwykle POST example.com/graphql 3. Serwer definiuje schemat danych 4. Klient ma prosty język zapytań GRAPHQL W PIGUŁCE
43. 1. Jeden endpoint 2. Zwykle POST example.com/graphql 3. Serwer definiuje schemat danych 4. Klient ma prosty język zapytań 5. Można robić wiele rzeczy na raz! GRAPHQL W PIGUŁCE
44. CO ROBIMY W GRAPHQL?
45. 1. Z serwera dostajemy dokumentację API (automatycznie wygenerowaną) CO ROBIMY W GRAPHQL?
46. 1. Z serwera dostajemy dokumentację API (automatycznie wygenerowaną) 2. Odpytujemy o dane za pomocą zapytań (Query) CO ROBIMY W GRAPHQL?
47. 1. Z serwera dostajemy dokumentację API (automatycznie wygenerowaną) 2. Odpytujemy o dane za pomocą zapytań (Query) 3. Modyfikujemy dane mutacjami (Mutation) CO ROBIMY W GRAPHQL?
48. GRAPHQL SCHEMA
49. AUTOMATYCZNA DOKUMENTACJA
50. ZAPYTANIA GRAPHQL
51. ZAPYTANIA GRAPHQL
52. ZAPYTANIA GRAPHQL
53. ZAPYTANIA GRAPHQL
54. ZAPYTANIA GRAPHQL
55. ZAPYTANIA GRAPHQL
56. ZAPYTANIA GRAPHQL
57. MUTACJE GRAPHQL
58. MUTACJE GRAPHQL
59. MUTACJE GRAPHQL
60. MUTACJE GRAPHQL
61. MUTACJE GRAPHQL
62. MUTACJE GRAPHQL
63. MUTACJE GRAPHQL
64. MUTACJE GRAPHQL
65. MUTACJE GRAPHQL
66. MUTACJE GRAPHQL
67. MUTACJE GRAPHQL
68. PROBLEMY GRAPHQL
69. PROBLEMY GRAPHQL 1. Cache 2. Optymalizacja złożonych zapytań 3. Denial of Service
70. PROBLEMY GRAPHQL
71. PROBLEMY GRAPHQL ☠
72. CO WYBRAĆ?
73. DLACZEGO REST?
74. DLACZEGO REST? 1. Publicznie dostępne API (REST łatwiej zabezpieczyć)
75. DLACZEGO REST? 1. Publicznie dostępne API (REST łatwiej zabezpieczyć) 2. Stabilne API (w REST trudniej wprowadzać zmiany)
76. DLACZEGO REST? 1. Publicznie dostępne API (REST łatwiej zabezpieczyć) 2. Stabilne API (w REST trudniej wprowadzać zmiany) 3. Aplikacja to typowy CRUD (wystarczy GET, POST, PUT, DELETE)
77. DLACZEGO REST? 1. Publicznie dostępne API (REST łatwiej zabezpieczyć) 2. Stabilne API (w REST trudniej wprowadzać zmiany) 3. Aplikacja to typowy CRUD (wystarczy GET, POST, PUT, DELETE) 4. Aplikacja ma już swoje lata :)
78. DLACZEGO GRAPHQL?
79. DLACZEGO GRAPHQL? Bo to sama przyjemność! :)
80. DLACZEGO GRAPHQL? 1. Wewnętrzne API (mobilne i webowe apki chcą innych danych)
81. DLACZEGO GRAPHQL? 1. Wewnętrzne API (mobilne i webowe apki chcą innych danych) 2. Prototypowanie i startupy (w GraphQL łatwiej wprowadzać zmiany)
82. DLACZEGO GRAPHQL? 1. Wewnętrzne API (mobilne i webowe apki chcą innych danych) 2. Prototypowanie i startupy (w GraphQL łatwiej wprowadzać zmiany) 3. Aplikacja to nie tylko CRUD (w GraphQL łatwiej modelować zdarzenia biznesowe)
83. DLACZEGO GRAPHQL? 1. Wewnętrzne API (mobilne i webowe apki chcą innych danych) 2. Prototypowanie i startupy (w GraphQL łatwiej wprowadzać zmiany) 3. Aplikacja to nie tylko CRUD (w GraphQL łatwiej modelować zdarzenia biznesowe) 4. Integracja danych z różnych źródeł (1 serwer proxy w GraphQL)
84. DEMO 1. GraphQL https://graphql.org/swapi-graphql 2. REST https://swapi.dev/
85. NAGRANIE I SLAJDY https://graphqlmastery.pl/graphql-vs-rest-replay