[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6CCBZRP7BAVHFM2M3XQDEHT":3,"skill-same:01M6CCBZRP7BAVHFM2M3XQDEHT":69},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":23,"publishedAt":31,"linkOnly":32,"markdownContent":33,"markdownBody":34,"frontMatter":35,"refName":36,"commitSha":37,"skillDirectory":38,"forksCount":14,"repositoryHtmlUrl":39,"repositoryHomepageUrl":40,"ownerHtmlUrl":41,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":42,"install":43,"resources":56},"01M6CCBZRP7BAVHFM2M3XQDEHT","convex-quickstart",null,"Initialize a new Convex project from scratch or add Convex to an existing app. Use when starting a new project with Convex, scaffolding a Convex app, or integrating Convex into an existing frontend.","baisharg\u002FASTN","baisharg","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F204916775?v=4","01M6CC8XHZYVK2DR22FZ1BESCG","BAISH","01M6CC8XP400QZ9DXAWTC8EG3X",2,"AGPL-3.0","https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.agents\u002Fskills\u002Fconvex-quickstart\u002FSKILL.md",[18],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000009","前端开发","SCENARIO","使用场景",[24,25,26,27,28,29,30],"convex quickstart","convex","quickstart","frontend","new project","initialize","use","2026-11-10 10:12:30",false,"---\nname: convex-quickstart\ndescription: Initialize a new Convex project from scratch or add Convex to an existing app. Use when starting a new project with Convex, scaffolding a Convex app, or integrating Convex into an existing frontend.\n---\n\n# Convex Quickstart\n\nSet up a working Convex project as fast as possible.\n\n## When to Use\n\n- Starting a brand new project with Convex\n- Adding Convex to an existing React, Next.js, Vue, Svelte, or other app\n- Scaffolding a Convex app for prototyping\n\n## When Not to Use\n\n- The project already has Convex installed and `convex\u002F` exists - just start building\n- You only need to add auth to an existing Convex app - use the `convex-setup-auth` skill\n\n## Workflow\n\n1. Determine the starting point: new project or existing app\n2. If new project, pick a template and scaffold with `npm create convex@latest`\n3. If existing app, install `convex` and wire up the provider\n4. Run `npx convex dev` to connect a deployment and start the dev loop\n5. Verify the setup works\n\n## Path 1: New Project (Recommended)\n\nUse the official scaffolding tool. It creates a complete project with the frontend framework, Convex backend, and all config wired together.\n\n### Pick a template\n\n| Template                   | Stack                                     |\n| -------------------------- | ----------------------------------------- |\n| `react-vite-shadcn`        | React + Vite + Tailwind + shadcn\u002Fui       |\n| `nextjs-shadcn`            | Next.js App Router + Tailwind + shadcn\u002Fui |\n| `react-vite-clerk-shadcn`  | React + Vite + Clerk auth + shadcn\u002Fui     |\n| `nextjs-clerk`             | Next.js + Clerk auth                      |\n| `nextjs-convexauth-shadcn` | Next.js + Convex Auth + shadcn\u002Fui         |\n| `nextjs-lucia-shadcn`      | Next.js + Lucia auth + shadcn\u002Fui          |\n| `bare`                     | Convex backend only, no frontend          |\n\nIf the user has not specified a preference, default to `react-vite-shadcn` for simple apps or `nextjs-shadcn` for apps that need SSR or API routes.\n\nYou can also use any GitHub repo as a template:\n\n```bash\nnpm create convex@latest my-app -- -t owner\u002Frepo\nnpm create convex@latest my-app -- -t owner\u002Frepo#branch\n```\n\n### Scaffold the project\n\nAlways pass the project name and template flag to avoid interactive prompts:\n\n```bash\nnpm create convex@latest my-app -- -t react-vite-shadcn\ncd my-app\nnpm install\n```\n\nThe scaffolding tool creates files but does not run `npm install`, so you must run it yourself.\n\nTo scaffold in the current directory (if it is empty):\n\n```bash\nnpm create convex@latest . -- -t react-vite-shadcn\nnpm install\n```\n\n### Start the dev loop\n\n`npx convex dev` is a long-running watcher process that syncs backend code to a Convex deployment on every save. It also requires authentication on first run (browser-based OAuth). Both of these make it unsuitable for an agent to run directly.\n\n**Ask the user to run this themselves:**\n\nTell the user to run `npx convex dev` in their terminal. On first run it will prompt them to log in or develop anonymously. Once running, it will:\n\n- Create a Convex project and dev deployment\n- Write the deployment URL to `.env.local`\n- Create the `convex\u002F` directory with generated types\n- Watch for changes and sync continuously\n\nThe user should keep `npx convex dev` running in the background while you work on code. The watcher will automatically pick up any files you create or edit in `convex\u002F`.\n\n**Exception - cloud agents (Codex, Jules, Devin):** These environments cannot open a browser for login. See the Agent Mode section below for how to run anonymously without user interaction.\n\n### Start the frontend\n\nThe user should also run the frontend dev server in a separate terminal:\n\n```bash\nnpm run dev\n```\n\nVite apps serve on `http:\u002F\u002Flocalhost:5173`, Next.js on `http:\u002F\u002Flocalhost:3000`.\n\n### What you get\n\nAfter scaffolding, the project structure looks like:\n\n```\nmy-app\u002F\n  convex\u002F           # Backend functions and schema\n    _generated\u002F     # Auto-generated types (check this into git)\n    schema.ts       # Database schema (if template includes one)\n  src\u002F              # Frontend code (or app\u002F for Next.js)\n  package.json\n  .env.local        # CONVEX_URL \u002F VITE_CONVEX_URL \u002F NEXT_PUBLIC_CONVEX_URL\n```\n\nThe template already has:\n\n- `ConvexProvider` wired into the app root\n- Correct env var names for the framework\n- Tailwind and shadcn\u002Fui ready (for shadcn templates)\n- Auth provider configured (for auth templates)\n\nYou are ready to start adding schema, functions, and UI.\n\n## Path 2: Add Convex to an Existing App\n\nUse this when the user already has a frontend project and wants to add Convex as the backend.\n\n### Install\n\n```bash\nnpm install convex\n```\n\n### Initialize and start dev loop\n\nAsk the user to run `npx convex dev` in their terminal. This handles login, creates the `convex\u002F` directory, writes the deployment URL to `.env.local`, and starts the file watcher. See the notes in Path 1 about why the agent should not run this directly.\n\n### Wire up the provider\n\nThe Convex client must wrap the app at the root. The setup varies by framework.\n\nCreate the `ConvexReactClient` at module scope, not inside a component:\n\n```tsx\n\u002F\u002F Bad: re-creates the client on every render\nfunction App() {\n  const convex = new ConvexReactClient(\n    import.meta.env.VITE_CONVEX_URL as string,\n  )\n  return \u003CConvexProvider client={convex}>...\u003C\u002FConvexProvider>\n}\n\n\u002F\u002F Good: created once at module scope\nconst convex = new ConvexReactClient(import.meta.env.VITE_CONVEX_URL as string)\nfunction App() {\n  return \u003CConvexProvider client={convex}>...\u003C\u002FConvexProvider>\n}\n```\n\n#### React (Vite)\n\n```tsx\n\u002F\u002F src\u002Fmain.tsx\nimport { StrictMode } from 'react'\nimport { createRoot } from 'react-dom\u002Fclient'\nimport { ConvexProvider, ConvexReactClient } from 'convex\u002Freact'\nimport App from '.\u002FApp'\n\nconst convex = new ConvexReactClient(import.meta.env.VITE_CONVEX_URL as string)\n\ncreateRoot(document.getElementById('root')!).render(\n  \u003CStrictMode>\n    \u003CConvexProvider client={convex}>\n      \u003CApp \u002F>\n    \u003C\u002FConvexProvider>\n  \u003C\u002FStrictMode>,\n)\n```\n\n#### Next.js (App Router)\n\n```tsx\n\u002F\u002F app\u002FConvexClientProvider.tsx\n'use client'\n\nimport { ConvexProvider, ConvexReactClient } from 'convex\u002Freact'\nimport { ReactNode } from 'react'\n\nconst convex = new ConvexReactClient(process.env.NEXT_PUBLIC_CONVEX_URL!)\n\nexport function ConvexClientProvider({ children }: { children: ReactNode }) {\n  return \u003CConvexProvider client={convex}>{children}\u003C\u002FConvexProvider>\n}\n```\n\n```tsx\n\u002F\u002F app\u002Flayout.tsx\nimport { ConvexClientProvider } from '.\u002FConvexClientProvider'\n\nexport default function RootLayout({\n  children,\n}: {\n  children: React.ReactNode\n}) {\n  return (\n    \u003Chtml lang=\"en\">\n      \u003Cbody>\n        \u003CConvexClientProvider>{children}\u003C\u002FConvexClientProvider>\n      \u003C\u002Fbody>\n    \u003C\u002Fhtml>\n  )\n}\n```\n\n#### Other frameworks\n\nFor Vue, Svelte, React Native, TanStack Start, Remix, and others, follow the matching quickstart guide:\n\n- [Vue](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Fvue)\n- [Svelte](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Fsvelte)\n- [React Native](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Freact-native)\n- [TanStack Start](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Ftanstack-start)\n- [Remix](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Fremix)\n- [Node.js (no frontend)](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Fnodejs)\n\n### Environment variables\n\nThe env var name depends on the framework:\n\n| Framework    | Variable                 |\n| ------------ | ------------------------ |\n| Vite         | `VITE_CONVEX_URL`        |\n| Next.js      | `NEXT_PUBLIC_CONVEX_URL` |\n| Remix        | `CONVEX_URL`             |\n| React Native | `EXPO_PUBLIC_CONVEX_URL` |\n\n`npx convex dev` writes the correct variable to `.env.local` automatically.\n\n## Agent Mode (Cloud-Based Agents)\n\nWhen running in a cloud-based agent environment (Codex, Jules, Devin, Cursor Background Agents) where you cannot log in interactively, set `CONVEX_AGENT_MODE=anonymous` to use a local anonymous deployment.\n\nAdd `CONVEX_AGENT_MODE=anonymous` to `.env.local`, or set it inline:\n\n```bash\nCONVEX_AGENT_MODE=anonymous npx convex dev\n```\n\nThis runs a local Convex backend on the VM without requiring authentication, and avoids conflicting with the user's personal dev deployment.\n\n## Verify the Setup\n\nAfter setup, confirm everything is working:\n\n1. The user confirms `npx convex dev` is running without errors\n2. The `convex\u002F_generated\u002F` directory exists and has `api.ts` and `server.ts`\n3. `.env.local` contains the deployment URL\n\n## Writing Your First Function\n\nOnce the project is set up, create a schema and a query to verify the full loop works.\n\n`convex\u002Fschema.ts`:\n\n```ts\nimport { defineSchema, defineTable } from 'convex\u002Fserver'\nimport { v } from 'convex\u002Fvalues'\n\nexport default defineSchema({\n  tasks: defineTable({\n    text: v.string(),\n    completed: v.boolean(),\n  }),\n})\n```\n\n`convex\u002Ftasks.ts`:\n\n```ts\nimport { query, mutation } from '.\u002F_generated\u002Fserver'\nimport { v } from 'convex\u002Fvalues'\n\nexport const list = query({\n  args: {},\n  handler: async (ctx) => {\n    return await ctx.db.query('tasks').collect()\n  },\n})\n\nexport const create = mutation({\n  args: { text: v.string() },\n  handler: async (ctx, args) => {\n    await ctx.db.insert('tasks', { text: args.text, completed: false })\n  },\n})\n```\n\nUse in a React component (adjust the import path based on your file location relative to `convex\u002F`):\n\n```tsx\nimport { useQuery, useMutation } from 'convex\u002Freact'\nimport { api } from '..\u002Fconvex\u002F_generated\u002Fapi'\n\nfunction Tasks() {\n  const tasks = useQuery(api.tasks.list)\n  const create = useMutation(api.tasks.create)\n\n  return (\n    \u003Cdiv>\n      \u003Cbutton onClick={() => create({ text: 'New task' })}>Add\u003C\u002Fbutton>\n      {tasks?.map((t) => (\n        \u003Cdiv key={t._id}>{t.text}\u003C\u002Fdiv>\n      ))}\n    \u003C\u002Fdiv>\n  )\n}\n```\n\n## Development vs Production\n\nAlways use `npx convex dev` during development. It runs against your personal dev deployment and syncs code on save.\n\nWhen ready to ship, deploy to production:\n\n```bash\nnpx convex deploy\n```\n\nThis pushes to the production deployment, which is separate from dev. Do not use `deploy` during development.\n\n## Next Steps\n\n- Add authentication: use the `convex-setup-auth` skill\n- Design your schema: see [Schema docs](https:\u002F\u002Fdocs.convex.dev\u002Fdatabase\u002Fschemas)\n- Build components: use the `convex-create-component` skill\n- Plan a migration: use the `convex-migration-helper` skill\n- Add file storage: see [File Storage docs](https:\u002F\u002Fdocs.convex.dev\u002Ffile-storage)\n- Set up cron jobs: see [Scheduling docs](https:\u002F\u002Fdocs.convex.dev\u002Fscheduling)\n\n## Checklist\n\n- [ ] Determined starting point: new project or existing app\n- [ ] If new project: scaffolded with `npm create convex@latest` using appropriate template\n- [ ] If existing app: installed `convex` and wired up the provider\n- [ ] User has `npx convex dev` running and connected to a deployment\n- [ ] `convex\u002F_generated\u002F` directory exists with types\n- [ ] `.env.local` has the deployment URL\n- [ ] Verified a basic query\u002Fmutation round-trip works\n","# Convex Quickstart\n\nSet up a working Convex project as fast as possible.\n\n## When to Use\n\n- Starting a brand new project with Convex\n- Adding Convex to an existing React, Next.js, Vue, Svelte, or other app\n- Scaffolding a Convex app for prototyping\n\n## When Not to Use\n\n- The project already has Convex installed and `convex\u002F` exists - just start building\n- You only need to add auth to an existing Convex app - use the `convex-setup-auth` skill\n\n## Workflow\n\n1. Determine the starting point: new project or existing app\n2. If new project, pick a template and scaffold with `npm create convex@latest`\n3. If existing app, install `convex` and wire up the provider\n4. Run `npx convex dev` to connect a deployment and start the dev loop\n5. Verify the setup works\n\n## Path 1: New Project (Recommended)\n\nUse the official scaffolding tool. It creates a complete project with the frontend framework, Convex backend, and all config wired together.\n\n### Pick a template\n\n| Template                   | Stack                                     |\n| -------------------------- | ----------------------------------------- |\n| `react-vite-shadcn`        | React + Vite + Tailwind + shadcn\u002Fui       |\n| `nextjs-shadcn`            | Next.js App Router + Tailwind + shadcn\u002Fui |\n| `react-vite-clerk-shadcn`  | React + Vite + Clerk auth + shadcn\u002Fui     |\n| `nextjs-clerk`             | Next.js + Clerk auth                      |\n| `nextjs-convexauth-shadcn` | Next.js + Convex Auth + shadcn\u002Fui         |\n| `nextjs-lucia-shadcn`      | Next.js + Lucia auth + shadcn\u002Fui          |\n| `bare`                     | Convex backend only, no frontend          |\n\nIf the user has not specified a preference, default to `react-vite-shadcn` for simple apps or `nextjs-shadcn` for apps that need SSR or API routes.\n\nYou can also use any GitHub repo as a template:\n\n```bash\nnpm create convex@latest my-app -- -t owner\u002Frepo\nnpm create convex@latest my-app -- -t owner\u002Frepo#branch\n```\n\n### Scaffold the project\n\nAlways pass the project name and template flag to avoid interactive prompts:\n\n```bash\nnpm create convex@latest my-app -- -t react-vite-shadcn\ncd my-app\nnpm install\n```\n\nThe scaffolding tool creates files but does not run `npm install`, so you must run it yourself.\n\nTo scaffold in the current directory (if it is empty):\n\n```bash\nnpm create convex@latest . -- -t react-vite-shadcn\nnpm install\n```\n\n### Start the dev loop\n\n`npx convex dev` is a long-running watcher process that syncs backend code to a Convex deployment on every save. It also requires authentication on first run (browser-based OAuth). Both of these make it unsuitable for an agent to run directly.\n\n**Ask the user to run this themselves:**\n\nTell the user to run `npx convex dev` in their terminal. On first run it will prompt them to log in or develop anonymously. Once running, it will:\n\n- Create a Convex project and dev deployment\n- Write the deployment URL to `.env.local`\n- Create the `convex\u002F` directory with generated types\n- Watch for changes and sync continuously\n\nThe user should keep `npx convex dev` running in the background while you work on code. The watcher will automatically pick up any files you create or edit in `convex\u002F`.\n\n**Exception - cloud agents (Codex, Jules, Devin):** These environments cannot open a browser for login. See the Agent Mode section below for how to run anonymously without user interaction.\n\n### Start the frontend\n\nThe user should also run the frontend dev server in a separate terminal:\n\n```bash\nnpm run dev\n```\n\nVite apps serve on `http:\u002F\u002Flocalhost:5173`, Next.js on `http:\u002F\u002Flocalhost:3000`.\n\n### What you get\n\nAfter scaffolding, the project structure looks like:\n\n```\nmy-app\u002F\n  convex\u002F           # Backend functions and schema\n    _generated\u002F     # Auto-generated types (check this into git)\n    schema.ts       # Database schema (if template includes one)\n  src\u002F              # Frontend code (or app\u002F for Next.js)\n  package.json\n  .env.local        # CONVEX_URL \u002F VITE_CONVEX_URL \u002F NEXT_PUBLIC_CONVEX_URL\n```\n\nThe template already has:\n\n- `ConvexProvider` wired into the app root\n- Correct env var names for the framework\n- Tailwind and shadcn\u002Fui ready (for shadcn templates)\n- Auth provider configured (for auth templates)\n\nYou are ready to start adding schema, functions, and UI.\n\n## Path 2: Add Convex to an Existing App\n\nUse this when the user already has a frontend project and wants to add Convex as the backend.\n\n### Install\n\n```bash\nnpm install convex\n```\n\n### Initialize and start dev loop\n\nAsk the user to run `npx convex dev` in their terminal. This handles login, creates the `convex\u002F` directory, writes the deployment URL to `.env.local`, and starts the file watcher. See the notes in Path 1 about why the agent should not run this directly.\n\n### Wire up the provider\n\nThe Convex client must wrap the app at the root. The setup varies by framework.\n\nCreate the `ConvexReactClient` at module scope, not inside a component:\n\n```tsx\n\u002F\u002F Bad: re-creates the client on every render\nfunction App() {\n  const convex = new ConvexReactClient(\n    import.meta.env.VITE_CONVEX_URL as string,\n  )\n  return \u003CConvexProvider client={convex}>...\u003C\u002FConvexProvider>\n}\n\n\u002F\u002F Good: created once at module scope\nconst convex = new ConvexReactClient(import.meta.env.VITE_CONVEX_URL as string)\nfunction App() {\n  return \u003CConvexProvider client={convex}>...\u003C\u002FConvexProvider>\n}\n```\n\n#### React (Vite)\n\n```tsx\n\u002F\u002F src\u002Fmain.tsx\nimport { StrictMode } from 'react'\nimport { createRoot } from 'react-dom\u002Fclient'\nimport { ConvexProvider, ConvexReactClient } from 'convex\u002Freact'\nimport App from '.\u002FApp'\n\nconst convex = new ConvexReactClient(import.meta.env.VITE_CONVEX_URL as string)\n\ncreateRoot(document.getElementById('root')!).render(\n  \u003CStrictMode>\n    \u003CConvexProvider client={convex}>\n      \u003CApp \u002F>\n    \u003C\u002FConvexProvider>\n  \u003C\u002FStrictMode>,\n)\n```\n\n#### Next.js (App Router)\n\n```tsx\n\u002F\u002F app\u002FConvexClientProvider.tsx\n'use client'\n\nimport { ConvexProvider, ConvexReactClient } from 'convex\u002Freact'\nimport { ReactNode } from 'react'\n\nconst convex = new ConvexReactClient(process.env.NEXT_PUBLIC_CONVEX_URL!)\n\nexport function ConvexClientProvider({ children }: { children: ReactNode }) {\n  return \u003CConvexProvider client={convex}>{children}\u003C\u002FConvexProvider>\n}\n```\n\n```tsx\n\u002F\u002F app\u002Flayout.tsx\nimport { ConvexClientProvider } from '.\u002FConvexClientProvider'\n\nexport default function RootLayout({\n  children,\n}: {\n  children: React.ReactNode\n}) {\n  return (\n    \u003Chtml lang=\"en\">\n      \u003Cbody>\n        \u003CConvexClientProvider>{children}\u003C\u002FConvexClientProvider>\n      \u003C\u002Fbody>\n    \u003C\u002Fhtml>\n  )\n}\n```\n\n#### Other frameworks\n\nFor Vue, Svelte, React Native, TanStack Start, Remix, and others, follow the matching quickstart guide:\n\n- [Vue](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Fvue)\n- [Svelte](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Fsvelte)\n- [React Native](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Freact-native)\n- [TanStack Start](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Ftanstack-start)\n- [Remix](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Fremix)\n- [Node.js (no frontend)](https:\u002F\u002Fdocs.convex.dev\u002Fquickstart\u002Fnodejs)\n\n### Environment variables\n\nThe env var name depends on the framework:\n\n| Framework    | Variable                 |\n| ------------ | ------------------------ |\n| Vite         | `VITE_CONVEX_URL`        |\n| Next.js      | `NEXT_PUBLIC_CONVEX_URL` |\n| Remix        | `CONVEX_URL`             |\n| React Native | `EXPO_PUBLIC_CONVEX_URL` |\n\n`npx convex dev` writes the correct variable to `.env.local` automatically.\n\n## Agent Mode (Cloud-Based Agents)\n\nWhen running in a cloud-based agent environment (Codex, Jules, Devin, Cursor Background Agents) where you cannot log in interactively, set `CONVEX_AGENT_MODE=anonymous` to use a local anonymous deployment.\n\nAdd `CONVEX_AGENT_MODE=anonymous` to `.env.local`, or set it inline:\n\n```bash\nCONVEX_AGENT_MODE=anonymous npx convex dev\n```\n\nThis runs a local Convex backend on the VM without requiring authentication, and avoids conflicting with the user's personal dev deployment.\n\n## Verify the Setup\n\nAfter setup, confirm everything is working:\n\n1. The user confirms `npx convex dev` is running without errors\n2. The `convex\u002F_generated\u002F` directory exists and has `api.ts` and `server.ts`\n3. `.env.local` contains the deployment URL\n\n## Writing Your First Function\n\nOnce the project is set up, create a schema and a query to verify the full loop works.\n\n`convex\u002Fschema.ts`:\n\n```ts\nimport { defineSchema, defineTable } from 'convex\u002Fserver'\nimport { v } from 'convex\u002Fvalues'\n\nexport default defineSchema({\n  tasks: defineTable({\n    text: v.string(),\n    completed: v.boolean(),\n  }),\n})\n```\n\n`convex\u002Ftasks.ts`:\n\n```ts\nimport { query, mutation } from '.\u002F_generated\u002Fserver'\nimport { v } from 'convex\u002Fvalues'\n\nexport const list = query({\n  args: {},\n  handler: async (ctx) => {\n    return await ctx.db.query('tasks').collect()\n  },\n})\n\nexport const create = mutation({\n  args: { text: v.string() },\n  handler: async (ctx, args) => {\n    await ctx.db.insert('tasks', { text: args.text, completed: false })\n  },\n})\n```\n\nUse in a React component (adjust the import path based on your file location relative to `convex\u002F`):\n\n```tsx\nimport { useQuery, useMutation } from 'convex\u002Freact'\nimport { api } from '..\u002Fconvex\u002F_generated\u002Fapi'\n\nfunction Tasks() {\n  const tasks = useQuery(api.tasks.list)\n  const create = useMutation(api.tasks.create)\n\n  return (\n    \u003Cdiv>\n      \u003Cbutton onClick={() => create({ text: 'New task' })}>Add\u003C\u002Fbutton>\n      {tasks?.map((t) => (\n        \u003Cdiv key={t._id}>{t.text}\u003C\u002Fdiv>\n      ))}\n    \u003C\u002Fdiv>\n  )\n}\n```\n\n## Development vs Production\n\nAlways use `npx convex dev` during development. It runs against your personal dev deployment and syncs code on save.\n\nWhen ready to ship, deploy to production:\n\n```bash\nnpx convex deploy\n```\n\nThis pushes to the production deployment, which is separate from dev. Do not use `deploy` during development.\n\n## Next Steps\n\n- Add authentication: use the `convex-setup-auth` skill\n- Design your schema: see [Schema docs](https:\u002F\u002Fdocs.convex.dev\u002Fdatabase\u002Fschemas)\n- Build components: use the `convex-create-component` skill\n- Plan a migration: use the `convex-migration-helper` skill\n- Add file storage: see [File Storage docs](https:\u002F\u002Fdocs.convex.dev\u002Ffile-storage)\n- Set up cron jobs: see [Scheduling docs](https:\u002F\u002Fdocs.convex.dev\u002Fscheduling)\n\n## Checklist\n\n- [ ] Determined starting point: new project or existing app\n- [ ] If new project: scaffolded with `npm create convex@latest` using appropriate template\n- [ ] If existing app: installed `convex` and wired up the provider\n- [ ] User has `npx convex dev` running and connected to a deployment\n- [ ] `convex\u002F_generated\u002F` directory exists with types\n- [ ] `.env.local` has the deployment URL\n- [ ] Verified a basic query\u002Fmutation round-trip works\n",{"name":5,"description":7},"main","83212e6d909b6a0fe9e93fd5a3ff1723300f5b5b",".agents\u002Fskills\u002Fconvex-quickstart","https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN","https:\u002F\u002Fsafetytalent.org","https:\u002F\u002Fgithub.com\u002Fbaisharg","2026-11-13 01:54:27",{"source":8,"skillName":5,"commands":44,"prompt":54,"zipAvailable":55},[45,48,51],{"tool":46,"command":47},"npx","npx skills add baisharg\u002FASTN --skill convex-quickstart",{"tool":49,"command":50},"bunx","bunx skills add baisharg\u002FASTN --skill convex-quickstart",{"tool":52,"command":53},"pnpm","pnpm dlx skills add baisharg\u002FASTN --skill convex-quickstart","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.agents\u002Fskills\u002Fconvex-quickstart\u002FSKILL.md",true,[57,63],{"path":58,"resourceType":59,"resourceTypeDesc":60,"sizeBytes":61,"sourceHtmlUrl":62},"agents\u002Fopenai.yaml","REFERENCE","参考文档",461,"https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.agents\u002Fskills\u002Fconvex-quickstart\u002Fagents\u002Fopenai.yaml",{"path":64,"resourceType":65,"resourceTypeDesc":66,"sizeBytes":67,"sourceHtmlUrl":68},"assets\u002Ficon.svg","ASSET","资产文件",435,"https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.agents\u002Fskills\u002Fconvex-quickstart\u002Fassets\u002Ficon.svg",[70,89,103,117,131,148],{"skillNo":71,"name":72,"nameZh":6,"description":73,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":74,"categories":75,"keywords":79,"publishedAt":31},"01M6CCE5DVER8DQWJDY51HAJF7","schema-builder","Design and generate Convex database schemas with proper validation, indexes, and relationships. Use when creating schema.ts or modifying table definitions.","https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fschema-builder\u002FSKILL.md",[76],{"categoryNo":77,"categoryName":78,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000015","视觉设计",[80,81,82,83,84,30,85,86,87,25,88],"schema builder","schema","builder","indexes","validation","table","database","design","generate",{"skillNo":90,"name":91,"nameZh":6,"description":92,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":93,"categories":94,"keywords":95,"publishedAt":31},"01M6CCE36AA57CG36R4VHKFRXV","integration-tanstack-start","PostHog integration for TanStack Start full-stack applications","https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fposthog-integration-tanstack-start\u002FSKILL.md",[],[96,97,98,99,100,101,102],"integration","start","tanstack","integration tanstack start","posthog","applications","stack",{"skillNo":104,"name":105,"nameZh":6,"description":106,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":107,"categories":108,"keywords":109,"publishedAt":31},"01M6CCE0FK6N8XAB093X7TTQ4F","migration-helper","Plan and execute Convex schema migrations safely, including adding fields, creating tables, and data transformations. Use when schema changes affect existing data.","https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fmigration-helper\u002FSKILL.md",[],[110,111,112,113,114,115,30,81,116,25],"migration","migration helper","schema migrations safely","data","plan","execute","migrations",{"skillNo":118,"name":119,"nameZh":6,"description":120,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":121,"categories":122,"keywords":123,"publishedAt":31},"01M6CCDY3644G8WXXP0BDNMZPR","gsd:sprint","Autonomous phase execution with Codex validation. Runs plan\u002Fexecute\u002Fverify cycles in a bash loop until done or halted.","https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fgsd-sprint\u002FSKILL.md",[],[119,124,125,84,97,126,127,128,129,114,130,115],"resume","codex","execution","verify","Bash","loop","autonomous",{"skillNo":132,"name":133,"nameZh":6,"description":134,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":135,"categories":136,"keywords":137,"publishedAt":31},"01M6CCDVTZRTFWWGREMV6FF956","gsd:second-opinion","Get a second opinion from OpenAI Codex (GPT-5.2-codex) on code, architecture, or implementation decisions. Use when you want independent verification or an alternative perspective.","https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fgsd-second-opinion\u002FSKILL.md",[],[138,139,140,125,141,142,143,144,145,146,30,147],"gsd:second opinion","second opinion","question","architecture","code","verification","openai","gpt","decisions","implementation",{"skillNo":149,"name":150,"nameZh":6,"description":151,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":152,"categories":153,"keywords":154,"publishedAt":31},"01M6CCDSDPYYNEDERHP01N30PT","gsd:milestone-sprint","Run entire milestone autonomously with Codex validation. Auto-detects current milestone, executes all phases, and runs audit.","https:\u002F\u002Fgithub.com\u002Fbaisharg\u002FASTN\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fgsd-milestone-sprint\u002FSKILL.md",[],[155,156,84,157,158,159,124,125],"gsd:milestone sprint","run","audit","interactive","auto"]