AI / ML#react#graphql#apollo#client
React GraphQL Apollo Client
Cursor rules for GraphQL development with Apollo Client integration.
Use it with Cursor, or export as AGENTS.md / CLAUDE.md for other AI coding agents — pick a format below.
// React + GraphQL (Apollo Client) .cursorrules
// Prefer functional components with hooks
const preferFunctionalComponents = true;
// GraphQL and Apollo Client best practices
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
const folderStructure = `
src/
components/
graphql/
queries/
mutations/
fragments/
hooks/
pages/
utils/
`;
// Additional instructions
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
`;How to use: save the file at your project root (e.g.
.cursorrules or AGENTS.md) and your AI editor picks it up automatically.Related rules
AI / ML→
Cursorrules Cursor AI Next.js 14 Tailwind SEO Setup
Cursor rules for Next.js development with Tailwind CSS and SEO optimization.
#cursor#ai#nextjs#14
AI / ML→
Next.js Supabase Shadcn PWA
Cursor rules for Nextjs Supabase Shadcn Pwa.
#nextjs#supabase#shadcn#pwa
AI / ML→
Next.js Vercel TypeScript
Cursor rules for Next.js development with Vercel and TypeScript integration.
#nextjs#vercel#typescript