GraphQL: Paginacja i filtrowanie
Projektowanie Serwera
2 godz. 7 min · Full-stack i Programowanie
Przemysław NowakSoftware EngineerCzego się nauczysz
- Stworzenie od 0 własnego serwera GraphQL opartego o NodeJS
- Omówienie trzech trzonów GraphQL czyli Query, Mutation, Subscription
- Wyjaśnienie korelacji Schema Resolver
- Wyjaśnienie jak skonfigurować aplikację na produkcję
- Stworzenie pełnej aplikacji książek w GraphQL
Swiat grafów i zapytań od strony serwera
Jeżeli kiedykolwiek używałeś GraphQL aby pobrać dane na Front-endzie to z pewnością wiesz, że aby to zrobić musisz znać połączenie Grafów oraz wiedzieć jak stworzyć odpowiednie zapytanie. W kursie tym nauczysz się jak takie grafy projektować od strony serwera i dostarczać je dla FrontEnd Developerów.
Schema i Resolvery
Dowiesz się jakie jest połączenie pomiędzy schematem serwera a resolverami. Schemat (schema) to nic innego jak opis aplikacji GraphQL z podziałem na typy i relacje - właśnie w taki sposób tworzą się grafy - natomiast resolvery są odpowiednikami w kodzie - wykonującymi się za każdym razem kiedy ktoś wysyła odpowiednie zapytanie. Dokładnie wytłumaczę Ci korelację pomiędzy tymi dwiema rzeczami oraz na konkretnych przykładach zrozumiesz jak je implementować.
GraphQL a rynek pracy
Statystyki są nieubłagane - coraz więcej firm inwestuje w GraphQL ze względu na rewolucyjne podejście do pobierania danych oraz jego prostotę. Dlatego jeżeli spojrzymy na rynek pracy to możemy zobaczyć, że GraphQL staję się pewnego rodzaju "must have", którego z pewnością warto się nauczyć.
Backend z prędkością światła
Przekonasz się, że tworzenie backendu z GraphQL jest niesamowicie szybkie. Kiedy zrozumiesz podstawowe połączenia schematu i resolverów nic Cie nie powstrzyma od błyskawicznego pisania kodu. Jeżeli chcesz stworzyć MVP, czy zaimplementować elastyczny mikro serwis to GraphQL może okazać się strzałem w dziesiątke dlatego, że możesz stworzyć aplikację z prędkością światła, a co więcej, każda rozbudowa jest bardzo prosta ze względu na brak zależności w kodzie.
Odczytywanie, Zapisywanie, Subskrybowanie
Tego wszystkiego nauczysz się w tym kursie, odczyt i zapis danych wydają się rzeczą normalną, natomiast dla mnie najciekawszą rzeczą są subskrypcje dzięki, którym możesz tworzyć aplikacje działające w czasie rzeczywistym. Zobaczysz, że z GraphQL wcale to nie jest skomplikowane, a wręcz banalnie proste!
Dla kogo jest ten kurs?
Kurs ten jest skierowany do osób, które mają podstawową wiedzę nt. GraphQLa oraz znają podstawy JavaScript - ponieważ za pomocą NodeJS zaimplementujemy serwer GraphQL. Jeśli jeszcze tego nie zrobiłeś/aś - polecamy przed przystąpieniem do tego kursu przerobienie materiałów JavaScript od Podstaw, kursu podstawowego GraphQL, a mile widziana jest także znajomość zagadnień z kursów Node.js.
W tej lekcji pokażę Ci jak filtrować dane oraz jak stworzyć prezentację.
A więc przejdźmy do.
I generalnie to co będziemy chcieli zrobić to stworzyć nację do pobierania książek.
To co teraz robimy to pobieramy wszystkie
książki jakie mamy dostępne w bazie danych, a więc zawsze dostajemy wynik
czterech książek, bo tylko tyle mamy w bazie danych.
Jeżeli zerkniemy na bazę, to tak właśnie jest.
Mamy pierwszą książkę, drugą, trzecią i
czwartą i będziemy chcieli dodać nację, aby można było pobrać dowolną ilość
książek oraz dwie rasy od drugiej do trzeciej i tak dalej.
Czyli generalnie tak jak działa nacja.
Chcemy dać taką możliwość jaką mamy często
w napędzie, aby frontend developer mógł wysyłać
request o taki zakres książek jakie on chce.
I oprzemy nacje na zasadzie offsetu oraz first czyli first.
Będzie nam mówiło ile książek chcemy
najpierw pobrać, a offset od jakiego indeksu powinniśmy zacząć.
Więc będziemy potrzebowali do tego dwóch argumentów i będzie to first.
To będzie int i to pole nie może być label.
Natomiast dodamy tutaj wartość domyślną, że będzie to 10 na przykład a offset.
To będzie również int integer i będzie to 0.
Czyli zaczynamy od zera.
To jest nasz offset
czyli odsunięcie indeksu i pobieramy pierwszych 10 książek od tego offset.
Znaczy tylko tyle, że jeżeli wyobrazisz
sobie, że mamy taką tablicę i te cyfry to są nasze książki w bazie danych,
to jeżeli mamy offset, który mówi, że jest to 0, czyli tak jak mamy teraz domyślnie,
to znaczy, że stąd zaczynamy klarować nasze książki.
Jeżeli mówimy, że pobieramy pierwszych 10, to pobieramy pierwszych 10 mamy to tylko
5, więc pobierze 5, natomiast gdyby było 10 podałby 10 itd.
Jeżeli offset wynosiłby np.
1, to wtedy zaczęlibyśmy pobierać odtąd
listę książek i pobrali byśmy pierwszych 10.
Jeżeli damy tutaj np.
argument first na 2, to przy offset 1 i 2 pobierzemy te dwie książki itd.
Itd.
Więc na tym polega racja w oparciu o first offset.
Więc implementujemy to.
Przejdźmy do naszego rewolweru z książkami.
I my już wiemy, że tutaj tak naprawdę już
nie będziemy zwracać wszystkich książek, tylko będziemy chcieli to zrobić.
Czyli dostaniemy tutaj dwa argumenty.
Wspomniany wcześniej first oraz offset.
I będziemy chcieli te książki w jakiś sposób przefiltrować.
Najlepszym sposobem, żeby to zrobić będzie
użycie po prostu wycięcia, czyli użyjemy metody slice,
która jako pierwszy argument przyjmuje skąd zaczynamy cięcie i gdzie je kończymy.
Czyli to jest dokładnie to, o czym mówiłem wcześniej, że jeżeli zaczynamy od zera,
czyli od offsetu, to zaczniemy od zera, natomiast tutaj przekazujemy offset.
To jest dokładnie tak, jakbyśmy przekazali to w taki sposób zaczynamy od zera,
pobieramy pierwszych dziesięć, czyli kończymy na dziesiątym indeksie.
I tak to będzie działało.
Czyli mówimy, że zaczynamy od offsetu i moglibyśmy tutaj dać first.
Natomiast problemem teraz w tej
implementacji będzie to, że kiedy offset zmieni się na np.
czy dalej powiemy, że chcemy pierwszych
10, to tutaj będziemy mieli taki zakres od trzeciego indeksu do 10.
A my potrzebujemy mieć zakres pierwszych
10 książek, ponieważ first to jest 10, więc potrzebujemy dodać do 10,
żebyśmy mieli zakres od trzeciego indeksu do 13.
Więc żeby to nam zadziałało, to musimy
tutaj po prostu dodać first + offset i nasza generacja powinna działać.
Przejdźmy do Play i zmodyfikujemy nieco to query.
Czyli teraz już powinniśmy mieć dostępny tutaj parametr first.
I będzie to 10 domyślnie.
Nie musimy teraz tego podawać.
Jeżeli to zrobimy to nic się nie powinno zmienić.
Pobrało nam drugą i trzecią książkę,
dlatego, że mamy tutaj w sumie tak
zdefiniowane dwa i offset 1 10 offset.
0, czyli tak jak powinny być wartości domyślne.
I teraz powinno nam pobrać wszystkie
książki, czyli pobrało nam wszystkie książki.
Do czwartej.
W porządku.
I teraz podajmy tutaj argumenty.
Niech to będzie fair.
I tutaj jako Ferris podamy tylko trzech.
W ten sposób. No i offset.
Niech to będzie 0, wtedy powinniśmy dostać 3 książki.
Nie powinniśmy dostać ostatniej, czwartej, druga, trzecia i to wszystko.
Teraz jeżeli zmienimy to znowu na offset,
czyli zaczynamy od drugiej książki, to powinniśmy dostać
w wyniku tylko książkę trzecią, ponieważ zaczynamy indeks od drugiej.
Pobieramy 3.
Pobieramy teraz jedną i teraz dostaliśmy tylko trzecią.
Tutaj pobiera się wcześniej pierwsze 3, więc zwróciło nam od indeksu drugiego
do końca wszystkie książki, więc tutaj mamy drugą i trzecią i czwartą.
No więc tak działa ta akcja.
Jest ona zaimplementowana, więc fajnie,
możemy to zostawić w zasadzie na domyślnych wartościach.
Natomiast kiedy ktoś by chciał się pakować np.
na stronie, to wtedy mógłby łatwo klikając
stronę drugą przesłać ciągle ten parametr w 10, a offset np.
11.
Mam nadzieję, że to jest dla ciebie jasne.
Dobra, więc to możemy zostawić tak jak było.
Wszystko nam tutaj działa i chciałbym jeszcze dodać teraz kolejny filter.
Mianowicie nie wiem czy zauważyłeś natomiast w.
Dobrze jest.
Jeżeli zerkniemy na komentarze to mamy tutaj taką tabelkę.
Komentarz jest zaobserwowany czy nie?
Czyli jeżeli nie jest zatwierdzony
to ma tabelkę, że nie jest zatwierdzony, czyli false.
Jeżeli jest to jest.
Więc ja bym chciał, żebyśmy dodali taki
filter, że podczas pobierania komentarzy będziemy mogli zdefiniować
czy chcemy pobrać komentarze tylko zatwierdzone lub tylko nie zatwierdzone.
Ponieważ możesz sobie wyobrazić taką sytuację, że jedna wersja będzie dla
jakiegoś moderatora, a druga wersja będzie tylko dla, na przykład dla
użytkownika zwykłego, który ogląda bez żadnych uprawnień stronę i wtedy nie
chciałby pewnie widzieć komentarzy nie zatwierdzonych.
Więc jeżeli zerkniemy na schemat
to możemy w typie bug dla komentarzy to zrobić
i dodać tutaj filter, który nazwiemy filter baj a.
I to będzie typ bólu.
Nie możemy domyślnie powiedzieć, że nie pozwalamy pobierać
nie zaaprobowany komentarzy, więc będziemy pozwalać pobrać tylko te zaaprobowane.
Więc teraz przejdźmy do Book Recorder.
Tutaj mamy komentarze i mamy tutaj ten podstawowy filter.
Który mówi nam, czy dany komentarz jest przypisany do danej książki.
My będziemy poza tym podstawowym filtrem chcieli zrobić coś jeszcze.
Ten koment możemy zostawić.
Natomiast stwórzmy sobie tutaj Basic Filter i to jest nasz
basic filter, czyli sprawdzający ID pola booka, ID i ID książki.
I teraz będziemy musieli dodać jeszcze jeden argument.
Mianowicie jeżeli tutaj będziemy dostawali to Filter by ID bay a trust jako true
to będziemy chcieli również jeszcze przefiltrować.
Do tego filtra dodać filter czy dany
komentarz jest zaaprobowany i wtedy go dopiero zwrócić?
Jeżeli nie to go nie będziemy chcieli zwracać.
Więc w zasadzie mogłoby to wyglądać tak, że jeżeli nie mamy tego filtra
to po prostu zwracamy tą wartość czyli Basic filter.
Ale jeżeli ktoś tutaj dodał to na true to wtedy będziemy chcieli powiedzieć, że
najpierw zrób basic filter, a dodatkowo sprawdź czy ten komentarz ma flaga.
Oznaczoną jako.
I teraz to powinno nam działać.
Możemy zobaczyć to w tej rundzie
i teraz komentarze powinny się nam zwrócić w sposób taki, że ten 1 jest, ten jest.
No więc te komentarze tutaj są.
Natomiast możemy dodać flagę approved, żebyśmy widzieli.
Które komentarze są które?
Wykonajmy query jeszcze raz.
I tutaj mamy na przykład jeden komentarz zaaprobowany, drugi już nie.
Więc po prostu może dodajmy ten filter, żeby zobaczyć czy on działa.
Filter by AfD, żeby dostać tylko tylko zaaprobowane komentarze.
Więc teraz ten komentarz powinien nam wylecieć.
OK, dostaliśmy tego komentarza, drugiego już nie ma.
Dobra, więc filtry działają.
Działa, więc myślę, że już wiesz jak te dane wybiórczo pobierać.
W zasadzie to nie była to jakaś wielka nowość.
Natomiast chciałem, żebyś zobaczył, że
przez te argumenty możemy również w taki sposób filtrować dane i
je wybierać, zwłaszcza jeżeli robimy to dla osobnych pól w Resolve.
I to już wszystko w sekcji Query.
A już teraz zapraszam Cię do sekcji
Mutacje, gdzie pokażę Ci jak dodawać aktualizować dane.