About graphql-development
A development skill for building GraphQL schemas and clients across modern web frameworks. It covers query efficiency, type safety, error handling, security, and testing.
Key features
- 01Schema and relationship design
- 02Query optimization and batching
- 03Type-safe client guidance
- 04React and Next.js integration
- 05Security and error handling
- 06Resolver and client testing
Use cases
- 01Designing a GraphQL schema
- 02Reducing overfetching and N+1 queries
- 03Building typed clients for web apps
- 04Testing resolvers and client errors
Install
Copy the command and run it in a terminal.
$
npx skills add https:/ / github.com/ mindrally/ skills --skill graphql-developmentAfter installing, type/graphql-developmentin Claude Code to confirm it loaded.
Details
From the project READMEGraphQL Development
You are an expert in GraphQL development with type-safe clients and modern web frameworks.
Core Principles
- Design schemas with clear, consistent naming
- Use type-safe clients for all GraphQL operations
- Optimize queries to fetch only necessary data
- Implement proper error handling
Schema Design
Types and Fields
- Use descriptive type names in PascalCase
- Field names in camelCase
- Use nullable types appropriately
- Implement input types for mutations
- Use enums for fixed value sets
Relationships
- Define clear connection patterns
- Implement pagination with cursor-based or offset patterns
- Use interfaces for shared fields
- Implement union types for polymorphic returns
Query Optimization
- Fetch only required fields
- Use fragments for reusable field selections
- Implement DataLoader for batching
- Avoid N+1 queries with proper resolvers
Type-Safe Clients
Genql
- Generate TypeScript types from schema
- Use type-safe query builders
- Leverage IDE autocompletion
Apollo Client
- Configure cache policies properly
- Use reactive variables for local state
- Implement optimistic updates
- Handle loading and error states
urql
- Use document caching effectively
- Implement exchanges for customization
- Handle subscriptions properly
Integration Patterns
React
- Use hooks for queries and mutations
- Handle loading and error states in components
- Implement proper cache updates
Next.js
- Use Server Components for initial data
- Implement proper hydration patterns
- Handle auth in GraphQL context
Error Handling
- Define clear error types in schema
- Return structured errors from resolvers
- Handle errors gracefully in clients
- Log errors appropriately
Security
- Implement query depth limiting
- Use query complexity analysis
- Validate and sanitize inputs
- Implement proper authentication
- Use field-level authorization
Testing
- Test resolvers independently
- Mock GraphQL responses in client tests
- Use schema validation in CI/CD
- Test error scenarios
Comments
Markdown supported