Toolverse
Wszystkie skille

graphql-schema

autor: ChrisWiles

Wzorce GraphQL dla zapytań, mutacji i generowania typów w Apollo Client

Instalacja

Wybierz klienta i sklonuj repozytorium do odpowiedniego katalogu skilli.

Instalacja

Szybkie info

Kategoria
Backend
Wyświetlenia
1

O skillu

Skill do pracy z GraphQL — tworzysz zapytania i mutacje w plikach .gql, uruchamiasz kodogenerator, a następnie używasz wygenerowanych hooków React. Zawiera reguły struktury projektu, obsługę błędów dla mutacji i automatyczne typowanie TypeScript. Idealny dla frontendowców pracujących z Apollo Client.

Jak używać

  1. Utwórz plik .gql w katalogu komponentu lub w folderze graphql/ — napisz w nim zapytanie GraphQL (query) lub mutację (mutation) z parametrami i polami, które chcesz pobrać.

  2. Uruchom kodogenerator poleceniem npm run gql:typegen — narzędzie automatycznie wygeneruje plik .generated.ts z typami TypeScript i hookami React.

  3. Zaimportuj wygenerowany hook do komponentu (np. useGetItemsQuery lub useCreateItemMutation) — nigdy nie pisz surowych Apollo hooków ręcznie.

  4. W komponencie użyj hooku, przekazując zmienne jako opcje — hook zwraca data, loading, error i refetch, którymi zarządzasz w JSX.

  5. Dla mutacji zawsze dodaj obsługę błędów (onError handler) — nie pomijaj tego kroku, aby uniknąć nieobsługiwanych wyjątków.

  6. Nigdy nie wstawiaj literałów gql bezpośrednio w kod — zawsze twórz osobne pliki .gql i generuj z nich typy.

Podobne skille