mcpField
G
graphql-development

graphql-development

github.com/mindrallyDevelopment287665 installsUpdated 3w ago
Repository

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

  1. 01Schema and relationship design
  2. 02Query optimization and batching
  3. 03Type-safe client guidance
  4. 04React and Next.js integration
  5. 05Security and error handling
  6. 06Resolver and client testing

Use cases

  1. 01Designing a GraphQL schema
  2. 02Reducing overfetching and N+1 queries
  3. 03Building typed clients for web apps
  4. 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-development

After installing, type/graphql-developmentin Claude Code to confirm it loaded.

Details

From the project README

GraphQL 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