convex-nextjs

Workflow 1 — Add Convex to a Next.js app (App Router)

Step 1b (optional): Seed sample data + expose a first query If you want a known-good end-to-end smoke test:

Step 2: Create a client provider (Client Component) Create app/ConvexClientProvider.tsx:

Builds, integrates, and deploys Convex backends in Next.js (App Router by default, Pages Router supported). Covers running `npx convex dev`, defining Convex schema/indexes, writing queries/mutations/actions, wiring ConvexReactClient + ConvexProvider hooks (useQuery/useMutation), optional SSR preloading and Server Actions via convex/nextjs, authentication patterns, and deployment (including Vercel + preview deployments). Use when the user mentions Convex, convex.dev, Next.js + Convex, real-time database updates, Convex functions, schema/indexes, NEXT_PUBLIC_CONVEX_URL, convex dev/deploy, or troubleshooting Convex in a Next.js app. Source: tristanmanchester/agent-skills.