Agent skill

Convex Quickstart

by waynesutton in waynesutton/markdown-site

Initialize a new Convex project from scratch or add Convex to an existing app.

MITAuto-check: notesFrontend & Design

Install Convex Quickstart

skills CLI
$ npx skills add waynesutton/markdown-site --skill convex-quickstart -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install waynesutton/markdown-site convex-quickstart --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/waynesutton/markdown-site.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.claude/convex-quickstart .claude/skills/convex-quickstart && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
convex-quickstart
GitHub stars
628
Token cost
~1.2k tokens
SKILL.md length
357 words
Files
1
Skills in repo
17
Repo updated
First seen
Licence
MIT

At a glance

Initialize a new Convex project from scratch or add Convex to an existing app.

  • Works in 5 steps: Determine the starting point: new… → If new project, pick a template and… → If existing app, install convex and wire… → …
  • Starting a new project with Convex
  • SKILL.md covers When to Use, When Not to Use, Workflow and Path 1: New Project…, plus 3 more sections
  • Calls npm and npx

What it does

Convex Quickstart is an agent skill from waynesutton/markdown-site. 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.

Its SKILL.md is about 1.2k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Frontend & Design, covering Project scaffolding. It works with Next.js, shadcn/ui, Vite and React. The repository describes itself as: An open-source publishing framework built for AI agents and developers to ship websites, docs, or blogs. Write markdown, sync from the terminal. Your content is instantly… The licence is MIT.

When your agent uses it

  • Starting a new project with Convex
  • Scaffolding a Convex app
  • Integrating Convex into an existing frontend

Example prompts

  • “/convex-quickstart”

Requirements

  • Node.js

Workflow steps

5 steps, taken from the first numbered list in SKILL.md.

  1. Determine the starting point: new project or existing app
  2. If new project, pick a template and scaffold with npm create convex@latest
  3. If existing app, install convex and wire up the provider
  4. Run npx convex dev to connect a deployment and start the dev loop
  5. Verify the setup works

What it can do on your machine

Read from SKILL.md and the folder at commit 3872c59. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • npm
    • npx

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Links to these hosts (documentation or services it may open):

    • github.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Convex Quickstart loads about 1.2k tokens when it runs. Until then it costs about 54 tokens; SKILL.md has 357 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~54
When it runs · the whole SKILL.md, loaded when a task matches
~1.2k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check: notes

The automated check noted patterns worth knowing about, such as sudo or a known installer.

  • NoteMentions a .env fileSKILL.md:58
    - Write the deployment URL to `.env.local`
  • NoteMentions a .env fileSKILL.md:180
    - [ ] `.env.local` has the deployment URL

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from waynesutton/markdown-site at commit 3872c59, republished under its MIT licence (© waynesutton). 357 words, ~1,238 tokens.

Download SKILL.mdSave it as .claude/skills/convex-quickstart/SKILL.md (or your agent's skills folder).
name
convex-quickstart
description
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.

Convex Quickstart

Set up a working Convex project as fast as possible.

When to Use

  • Starting a brand new project with Convex
  • Adding Convex to an existing React, Next.js, Vue, Svelte, or other app
  • Scaffolding a Convex app for prototyping

When Not to Use

  • The project already has Convex installed and convex/ exists: just start building
  • You only need to add auth to an existing Convex app: use the convex-setup-auth skill

Workflow

  1. Determine the starting point: new project or existing app
  2. If new project, pick a template and scaffold with npm create convex@latest
  3. If existing app, install convex and wire up the provider
  4. Run npx convex dev to connect a deployment and start the dev loop
  5. Verify the setup works
Pick a template
TemplateStack
react-vite-shadcnReact + Vite + Tailwind + shadcn/ui
nextjs-shadcnNext.js App Router + Tailwind + shadcn/ui
react-vite-clerk-shadcnReact + Vite + Clerk auth + shadcn/ui
nextjs-clerkNext.js + Clerk auth
nextjs-convexauth-shadcnNext.js + Convex Auth + shadcn/ui
bareConvex backend only, no frontend

Default to react-vite-shadcn for simple apps or nextjs-shadcn for apps that need SSR or API routes.

Scaffold the project

Always pass the project name and template flag to avoid interactive prompts:

bash
npm create convex@latest my-app -- -t react-vite-shadcn
cd my-app
npm install
Show full SKILL.md (159 more words)Show less
Start the dev loop

Ask 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:

  • Create a Convex project and dev deployment
  • Write the deployment URL to .env.local
  • Create the convex/ directory with generated types
  • Watch for changes and sync continuously

Path 2: Add Convex to an Existing App

Install
bash
npm install convex
Wire up the provider
React (Vite)
tsx
// src/main.tsx
import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { ConvexProvider, ConvexReactClient } from "convex/react";
import App from "./App";

const convex = new ConvexReactClient(import.meta.env.VITE_CONVEX_URL as string);

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <ConvexProvider client={convex}>
      <App />
    </ConvexProvider>
  </StrictMode>,
);
Next.js (App Router)
tsx
// app/ConvexClientProvider.tsx
"use client";

import { ConvexProvider, ConvexReactClient } from "convex/react";
import { ReactNode } from "react";

const convex = new ConvexReactClient(process.env.NEXT_PUBLIC_CONVEX_URL!);

export function ConvexClientProvider({ children }: { children: ReactNode }) {
  return <ConvexProvider client={convex}>{children}</ConvexProvider>;
}
Environment variables
FrameworkVariable
ViteVITE_CONVEX_URL
Next.jsNEXT_PUBLIC_CONVEX_URL
RemixCONVEX_URL
React NativeEXPO_PUBLIC_CONVEX_URL

Writing Your First Function

convex/schema.ts:

ts
import { defineSchema, defineTable } from "convex/server";
import { v } from "convex/values";

export default defineSchema({
  tasks: defineTable({
    text: v.string(),
    completed: v.boolean(),
  }),
});

convex/tasks.ts:

ts
import { query, mutation } from "./_generated/server";
import { v } from "convex/values";

export const list = query({
  args: {},
  handler: async (ctx) => {
    return await ctx.db.query("tasks").collect();
  },
});

export const create = mutation({
  args: { text: v.string() },
  handler: async (ctx, args) => {
    await ctx.db.insert("tasks", { text: args.text, completed: false });
  },
});

Use in a React component:

tsx
import { useQuery, useMutation } from "convex/react";
import { api } from "../convex/_generated/api";

function Tasks() {
  const tasks = useQuery(api.tasks.list);
  const create = useMutation(api.tasks.create);

  return (
    <div>
      <button onClick={() => create({ text: "New task" })}>Add</button>
      {tasks?.map((t) => <div key={t._id}>{t.text}</div>)}
    </div>
  );
}

Checklist

  • Determined starting point: new project or existing app
  • If new project: scaffolded with npm create convex@latest using appropriate template
  • If existing app: installed convex and wired up the provider
  • User has npx convex dev running and connected to a deployment
  • convex/_generated/ directory exists with types
  • .env.local has the deployment URL
  • Verified a basic query/mutation round-trip works

Source: https://github.com/get-convex/agent-skills

© waynesutton, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in .claude/convex-quickstart of waynesutton/markdown-site.

Open the folder on GitHubat commit 3872c59

Compare with similar skills

Convex Quickstart next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Convex Quickstart compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Convex Quickstart this skillwaynesutton/markdown-site628—~1.2kAutomated safety check: NotesMIT
Convex Quickstartspokvulcan/poker-planning1146 repos~3.5kAutomated safety check: NotesMIT
Creative Tim UI Blockscreativetimofficial/ui12k—~2.1kAutomated safety check: NotesMIT
Frontend Design UltimateaAAaqwq/AGI-Super-Team1052 repos~2.7kAutomated safety check: PassMIT
Shadcn Tailwind UILiarMTTT/TavernWeave150—~1.7kAutomated safety check: PassCustom licence
NEAR dApp Builderinternet-court/internet-court-skill6.4k1 repos~684Automated safety check: PassCustom licence

Similar skills

  • Convex Quickstart

    spokvulcan/poker-planning

    Creates or adds Convex to an app. An agent skill from spokvulcan/poker-planning.

    114 GitHub starsUsed in 6 repos~3.5k tokens
    Frontend & DesignAuto-check: notes
  • Creative Tim UI Blocks

    creativetimofficial/ui

    Helps install, generate and review Creative Tim UI blocks: shadcn/ui-based React and Tailwind sections that follow a restrained, production-minded design philosophy.

    12k GitHub stars~2.1k tokensUpdated 6 mo ago
    Frontend & DesignAuto-check: notes
  • Frontend Design Ultimate

    aAAaqwq/AGI-Super-Team

    Create distinctive, production-grade static sites with React, Tailwind CSS, and shadcn/ui — no mockups needed.

    105 GitHub starsUsed in 2 repos~2.7k tokens
    Frontend & DesignAuto-check passed
  • Shadcn Tailwind UI

    LiarMTTT/TavernWeave

    Build, restyle, or review accessible React interfaces that use shadcn/ui, Radix UI primitives, and Tailwind CSS.

    150 GitHub stars~1.7k tokensUpdated 3 days ago
    Frontend & DesignAuto-check passed
  • NEAR dApp Builder

    internet-court/internet-court-skill

    Scaffolds new NEAR dApps with create-near-app or adds NEAR wallet sign-in, contract calls and transaction signing to an existing React or plain JavaScript app.

    6.4k GitHub starsUsed in 1 repo~684 tokens
    Frontend & DesignAuto-check passed
  • Vite Shadcn Tailwind4

    IgorWarzocha/Opencode-Workflows

    Initialize shadcn/ui + Tailwind CSS v4 in Vite projects (Vite-specific, not Next.js/Remix).

    122 GitHub stars~1.3k tokensUpdated 8 mo ago
    Frontend & DesignAuto-check passed

More from waynesutton/markdown-site

All 17 skills in this repo
  • Convex Self Hosting

    waynesutton/markdown-site

    Integrate Convex static self hosting into existing apps using the latest upstream instructions from get-convex/self-hosting every time.

    628 GitHub stars~1.4k tokensUpdated 4 mo ago
    Auto-check passed
  • Robel Auth

    waynesutton/markdown-site

    Integrate and maintain Robelest Convex Auth in apps by always checking upstream before implementation.

    628 GitHub stars~4.4k tokensUpdated 4 mo ago
    Auto-check passed
  • Migration Helper

    waynesutton/markdown-site

    Plan and execute Convex schema migrations safely, including adding fields, creating tables, and data transformations.

    628 GitHub starsUsed in 1 repo~958 tokens
    Auto-check passed
  • Convex Return Validators

    waynesutton/markdown-site

    Guide for when to use and when not to use return validators in Convex functions.

    628 GitHub stars~2.4k tokensUpdated 4 mo ago
    Auto-check passed
  • Convex Doctor

    waynesutton/markdown-site

    Run convex-doctor static analysis, interpret findings, and fix issues across security, performance, correctness, schema, and architecture categories.

    628 GitHub stars~1.9k tokensUpdated 4 mo ago
    Auto-check passed
  • Convex Setup Auth

    waynesutton/markdown-site

    Set up Convex authentication with proper user management, identity mapping, and access control patterns.

    628 GitHub stars~1.4k tokensUpdated 4 mo ago
    Auto-check passed

Questions about Convex Quickstart

What does Convex Quickstart do?

Initialize a new Convex project from scratch or add Convex to an existing app. Convex Quickstart is an agent skill from waynesutton/markdown-site. Initialize a new Convex project from scratch or add Convex to an existing app.

When should I use Convex Quickstart?

Convex Quickstart fits situations like: starting a new project with Convex; scaffolding a Convex app; integrating Convex into an existing frontend.

How do I install Convex Quickstart in Claude Code?

Run `npx skills add waynesutton/markdown-site --skill convex-quickstart -a claude-code`. Or copy the skill folder (.claude/convex-quickstart in waynesutton/markdown-site) into .claude/skills/convex-quickstart in your project. Claude Code loads it when a task matches its description.

How do I install Convex Quickstart in Codex?

Run `npx skills add waynesutton/markdown-site --skill convex-quickstart -a codex`. Or copy the skill folder (.claude/convex-quickstart in waynesutton/markdown-site) into .agents/skills/convex-quickstart in your project. Codex loads it when a task matches its description.

Can I use Convex Quickstart in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add waynesutton/markdown-site --skill convex-quickstart -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/convex-quickstart, .gemini/skills/convex-quickstart, .github/skills/convex-quickstart and .opencode/skills/convex-quickstart in your project.

What does Convex Quickstart need to run?

Going by SKILL.md and its folder, Convex Quickstart needs the command-line tools its instructions call (npm and npx). Our summary lists: Node.js.

Does Convex Quickstart access the network?

SKILL.md names 1 domain. As links in the text: github.com. This is read from the text; nothing was executed.

Is Convex Quickstart safe to install?

Our automated static check of SKILL.md found notes only (mentions a .env file), nothing it rates as a warning. It is not a guarantee. Review the folder before installing.

What licence does Convex Quickstart use?

Convex Quickstart is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Convex Quickstart use?

About 1.2k tokens (SKILL.md is roughly 5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Convex Quickstart?

Skills that share tags, products or a category with Convex Quickstart: Convex Quickstart (spokvulcan/poker-planning, 114 stars), Creative Tim UI Blocks (creativetimofficial/ui, 12k stars), Frontend Design Ultimate (aAAaqwq/AGI-Super-Team, 105 stars) and Shadcn Tailwind UI (LiarMTTT/TavernWeave, 150 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Convex Quickstart?

waynesutton (a GitHub user) maintains it in waynesutton/markdown-site, which has 628 GitHub stars. The repository holds 17 skills in this directory. The repository was last updated on May 20, 2026.

Source: waynesutton/markdown-site on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.