Wklej GraphQL SDL, dostan gotowe typy TypeScript
Masz SDL z backendu i potrzebujesz typow TypeScript do klienta. Bez setupu Apollo Codegen, bez configa, bez instalacji pluginow do CI. Wklejasz schemat po lewej, dostajesz gotowy plik `schema.types.ts` po prawej, kopiujesz albo pobierasz, wklejasz do projektu.
Generator chodzi po AST ze schematu (uzywamy oficjalnego pakietu `graphql`, tego samego ktorym chodzi sam Apollo i Yoga), wiec rozumie wszystkie konstrukcje: `type`, `interface`, `enum`, `union`, `input`, `scalar`, nullable vs non-nullable !. Listy wrapuje w `Array<T>`, input type dostaja wlasny TS interface (zachowujemy nazwe jak `UserInput`, zeby nie kolidowala z `User`).
Wszystko liczone w Node po Twojej stronie (route handler Next.js), schemat nie idzie do zadnego zewnetrznego API.
Jak uzywac
- Wklej GraphQL SDL do panelu po lewej. Domyslnie wgrywa sie przykladowy schemat z `type User`, `input UserInput` i `enum Status`, zebys od razu zobaczyl ksztalt wyjscia.
- Wybierz styl: `interface` albo `type`. `interface` jest blizszy temu, jak teamy pisza typy recznie, wspiera declaration merging i `extends`. `type` lepszy dla schematow z duza iloscia unii.
- Wlacz "JSDoc z opisow" jesli schemat ma `"""opis pola"""` nad polami. Generator przepisze je jako JSDoc nad TS, IDE pokaze tooltip przy hover.
- Wybierz styl nullable: `T | null` (czytelniejsze, zero importow) albo `Maybe<T>` (helper alias, blisko Apollo Codegen). scalar mapping i tak dziala dla obu.
- Wlacz "Connection / Edge / PageInfo" jesli schemat uzywa wzorca paginacji Relay. Generator doda generyczne `Connection<T>`, `Edge<T>` i `PageInfo` na gorze pliku.
- Edytuj mapowanie scalars zeby zmapowac `DateTime` -> `string` (najczestsze, server zwraca ISO 8601) albo `Date` -> `Date` jesli klient deserializuje, `JSON` -> `Record<string, unknown>`, `BigInt` -> `string` (bezpieczniej niz `bigint` przy JSON).
- Kliknij "Kopiuj" zeby wrzucic do schowka, albo "Pobierz plik" zeby zapisac jako `schema.types.ts`. Wklejasz do projektu, importujesz typy, gotowe.
Kiedy sie przydaje
Piec sytuacji, w ktorych ten generator zaoszczedza godzine konfiguracji codegena:
- Maly projekt, nie chcesz Apollo Codegen. Apollo Codegen / GraphQL Code Generator to potezne narzedzia, ale wymagaja configa, watch mode i instalacji pluginow. Dla 20 typow ze schematu Hasury albo PostGraphile prosciej raz wkleic SDL tutaj, raz wygenerowac, wrzucic do `types.ts` i zapomniec.
- Adoptujesz public GraphQL API (GitHub, Shopify, Stripe). Sciagasz introspection przez `graphql-cli get-schema`, wklejasz SDL tu, dostajesz typy klienta od reki. Bez wpinania ich pipeline w Twoj CI.
- Migrujesz z REST na GraphQL, masz juz typy REST i nie chcesz konfliktow. Generator emituje `UserInput` osobnym typem (a nie nadpisuje `User`), wiec mozesz miec oba typy w jednym pliku bez kolizji.
- Dokumentujesz schemat dla zespolu frontendowego. Frontend nie chce uczyc sie GraphQL SDL. Wklejasz schemat tu, wysylasz wygenerowany TS - drugi team widzi te same typy co backend, ale w jezyku ktory zna.
- Tworzysz mocki dla testow. TS interfaces wygenerowane stad sa idealne do `Factory<User>` w `vitest` / `jest`: mockujesz zwroty serwera, kompilator pilnuje, ze nie zapomniales pola.
Dla REST API odpowiednikiem jest OpenAPI → TypeScript. Do jednorazowych próbek JSON bez schemy szybszy bywa JSON → TypeScript.