convex-quickstart
Initializes a new Convex project from scratch or adds Convex to an existing app. Use this skill when starting a new project with Convex, scaffolding with npm create convex@latest, adding Convex to an existing React, Next.js, Vue, Svelte, or other frontend, wiring up ConvexProvider, configuring environment variables for the deployment URL, or running npx convex dev for the first time, even if the user just says "set up Convex" or "add a backend."
Security Assessment
Detected risks:
About convex-quickstart
The `convex-quickstart` skill is designed to streamline the process of setting up a Convex project, whether starting from scratch or integrating Convex into an existing application. It simplifies the initial configuration, scaffolding, and deployment setup, enabling developers to quickly create a fully functional backend connected to their frontend framework. This skill addresses the common challenges of initializing Convex projects, such as configuring environment variables, wiring up providers, and running development loops, reducing the setup time and minimizing potential errors during the first steps of a project.
The skill offers a range of features to accelerate project setup. It supports scaffolding new projects with official templates for popular frontend frameworks, including React, Next.js, Vue, and Svelte, as well as combinations with authentication systems like Clerk, Convex Auth, or Lucia. Users can also specify custom GitHub repositories as templates. Once scaffolded, the skill guides the user through installing dependencies, running `npx convex dev` for backend synchronization, and starting the frontend development server. The skill ensures the backend and frontend are properly connected and provides instructions for continuous syncing and environment setup, including automated creation of the `convex/` directory and `.env.local` configuration.
This skill is ideal for developers who are either beginning a new project with Convex or integrating it into an existing app that does not yet include a Convex backend. It is suitable for teams prototyping applications quickly, solo developers exploring Convex, and projects that require rapid scaffolding with minimal manual setup. Target users include frontend developers familiar with React, Next.js, Vue, or Svelte, as well as anyone seeking to efficiently connect a backend powered by Convex without spending time on repetitive configuration tasks.
FAQ
Can I use convex-quickstart with an existing React or Next.js project?
Yes, the skill supports adding Convex to existing frontend apps. You will need to install the Convex package and wire up the ConvexProvider as instructed.
What templates are available for new projects?
Official templates include options for React + Vite, Next.js App Router, combinations with Tailwind, shadcn/ui, and authentication systems like Clerk, Convex Auth, or Lucia. You can also specify a custom GitHub repository as a template.
Do I need to run npm install after scaffolding a project?
Yes. The scaffolding tool creates the project files but does not automatically install dependencies, so you must run `npm install` yourself.
How do I start the development loop for Convex?
You should run `npx convex dev` in your terminal. On the first run, it will prompt you to log in or develop anonymously. This process sets up the backend deployment, creates the `convex/` directory, and continuously syncs changes.
Are there limitations for cloud or headless environments?
Yes. Since `npx convex dev` requires a browser-based login, environments without a browser need to use Agent Mode to run anonymously without user interaction.
Install convex-quickstart
Quick Setup:
- Copy the skill folder to
.claude/skills/ - Claude will automatically detect and use the skill
Repository
get-convex/agent-skills