Typed GraphQL Client with Apollo and urql
Use generated hooks and operations for type-safe queries.
The Client Typing Problem
GraphQL clients like Apollo and urql return any typed data by default. Codegen generates typed hooks and operations that make queries fully type-safe.
// Without codegen: data is any
const { data } = useQuery(GET_USER);
data.user; // any — no safetyOperations Plugin for Apollo
Add @graphql-codegen/typescript-react-apollo to generate typed React hooks for each operation in your .graphql files.
npm install --save-dev @graphql-codegen/typescript-operations
npm install --save-dev @graphql-codegen/typescript-react-apolloAll lessons in this course
- GraphQL Schema to TypeScript Types
- Typed Resolvers with GraphQL Code Generator
- Typed GraphQL Client with Apollo and urql
- End-to-End Type Safety: Schema First Workflow