All databases

Cursor rule

React Graphql Apollo Client Cursorrules Prompt File

Cursor rules for GraphQL development with Apollo Client integration.

Prefer functional components with hooks

js
const preferFunctionalComponents = true;

GraphQL and Apollo Client best practices

js
const graphqlBestPractices = [
  "Use Apollo Client for state management and data fetching",
  "Implement query components for data fetching",
  "Utilize mutations for data modifications",
  "Use fragments for reusable query parts",
  "Implement proper error handling and loading states",
];

Folder structure

js
const folderStructure = `
src/
  components/
  graphql/
    queries/
    mutations/
    fragments/
  hooks/
  pages/
  utils/
`;

Additional instructions

js
const additionalInstructions = `
1. Use Apollo Provider at the root of your app
2. Implement custom hooks for Apollo operations
3. Use TypeScript for type safety with GraphQL operations
4. Utilize Apollo Client's caching capabilities
5. Implement proper error boundaries for GraphQL errors
6. Use Apollo Client DevTools for debugging
7. Follow naming conventions for queries, mutations, and fragments
`;

More Frontend rules

Frequently asked questions

What is the React Graphql Apollo Client Cursorrules Prompt File Cursor rule?

Cursor rules for GraphQL development with Apollo Client integration. It is a Frontend rule, stored as react-graphql-apollo-client-cursorrules-prompt-file.mdc.

How do I use the React Graphql Apollo Client Cursorrules Prompt File rule in Cursor?

Copy the rule from this page and save it as react-graphql-apollo-client-cursorrules-prompt-file.mdc in your project's .cursor/rules folder, or paste it into Cursor's project rules settings.