convex-self-hosting
Integrate Convex static self hosting into existing apps using the latest upstream instructions from get-convex/self-hosting every time. Use when setting up upload APIs, HTTP routes, deployment scripts, migration from external hosting, or troubleshooting static deploy issues across React, Vite, Next.js, and other frontends.
Best use case
convex-self-hosting is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Integrate Convex static self hosting into existing apps using the latest upstream instructions from get-convex/self-hosting every time. Use when setting up upload APIs, HTTP routes, deployment scripts, migration from external hosting, or troubleshooting static deploy issues across React, Vite, Next.js, and other frontends.
Teams using convex-self-hosting should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/convex-self-hosting/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How convex-self-hosting Compares
| Feature / Agent | convex-self-hosting | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Integrate Convex static self hosting into existing apps using the latest upstream instructions from get-convex/self-hosting every time. Use when setting up upload APIs, HTTP routes, deployment scripts, migration from external hosting, or troubleshooting static deploy issues across React, Vite, Next.js, and other frontends.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
# Convex self hosting skill
Use this skill to integrate Convex based static hosting in a repeatable way across projects.
## Non negotiable update check
Run this check before making any code changes or giving setup advice.
Preferred command:
```bash
bash .agents/skills/convex-self-hosting/scripts/check-upstream.sh
```
1. Read latest integration guide:
- `https://raw.githubusercontent.com/get-convex/self-hosting/main/INTEGRATION.md`
2. Read latest README manual setup section:
- `https://github.com/get-convex/self-hosting?tab=readme-ov-file#manual-setup-1`
3. Read Convex docs index for current guidance:
- `https://docs.convex.dev/llms.txt`
4. Confirm package publish state:
- `npm view @convex-dev/self-hosting version`
If upstream docs conflict with local rules, follow upstream docs and explain what changed.
## Clarifying questions you must ask first
Ask these before implementing:
1. Confirm `get-convex/self-hosting` is the source of truth for this setup.
2. Is the target app Vite, Next.js, Expo web export, or another bundler.
3. Do they want root path hosting or a prefix like `/app`.
4. Do they want one shot deploy or separate backend and static deploy steps.
5. If package is unpublished, do they want:
- GitHub dependency install
- vendored local copy
- wait for npm release
Never assume unpublished package install details.
## Install strategy
### Path A published package
If npm package exists, use the package directly.
```bash
npm install @convex-dev/self-hosting
```
### Path B package not published yet
If package is missing on npm, use GitHub source and pin to commit or tag.
```bash
npm install github:get-convex/self-hosting#main
```
If project policy requires deterministic builds, ask for a commit SHA and pin to it.
## Required file changes
Use the latest upstream file patterns from `INTEGRATION.md`.
### 1) `convex/convex.config.ts`
```typescript
import { defineApp } from "convex/server";
import selfHosting from "@convex-dev/self-hosting/convex.config";
const app = defineApp();
app.use(selfHosting);
export default app;
```
### 2) `convex/staticHosting.ts`
```typescript
import { components } from "./_generated/api";
import {
exposeUploadApi,
exposeDeploymentQuery,
} from "@convex-dev/self-hosting";
export const { generateUploadUrl, recordAsset, gcOldAssets, listAssets } =
exposeUploadApi(components.selfHosting);
export const { getCurrentDeployment } =
exposeDeploymentQuery(components.selfHosting);
```
### 3) `convex/http.ts`
```typescript
import { httpRouter } from "convex/server";
import { registerStaticRoutes } from "@convex-dev/self-hosting";
import { components } from "./_generated/api";
const http = httpRouter();
registerStaticRoutes(http, components.selfHosting);
export default http;
```
Optional prefix mode:
```typescript
registerStaticRoutes(http, components.selfHosting, {
pathPrefix: "/app",
spaFallback: true,
});
```
### 4) `package.json` scripts
```json
{
"scripts": {
"deploy": "npx @convex-dev/self-hosting deploy",
"deploy:static": "npx @convex-dev/self-hosting upload --build --prod"
}
}
```
## Deployment flow
### First setup
```bash
npm install @convex-dev/self-hosting
npx @convex-dev/self-hosting setup
npx convex dev --once
npm run deploy
```
### Ongoing deploys
```bash
npm run deploy
```
### Two step deploy alternative
```bash
npx convex deploy
npx @convex-dev/self-hosting upload --build --prod
```
Always use the tool driven build flow. Do not run `npm run build` first when using upload deploy commands.
## Cross app support notes
- Vite: use `--build` flow as default.
- Next.js and Expo: pass through `VITE_CONVEX_URL` in the app build script as documented upstream.
- Existing API routes: prefer `pathPrefix: "/app"` for static hosting.
- Keep upload APIs internal only and never expose them as public HTTP actions.
## Integration with convex agent plugins
If `get-convex/convex-agent-plugins` is present, follow its Convex rules with this skill:
- keep validators on all Convex functions
- keep internal functions for upload operations
- use indexed reads, avoid broad filtering in data access patterns
- preserve strict TypeScript in generated Convex and frontend code
Reference:
- `https://github.com/get-convex/convex-agent-plugins`
## Troubleshooting checklist
1. `404` for static routes:
- verify `convex/http.ts` exists and exports router.
2. `Cannot find module .../convex.config`:
- verify package install source and import path.
3. wrong backend URL in built assets:
- redeploy with CLI `--build` flow.
4. no updates visible:
- clear cache and verify deployment ID changes.
5. HTTP actions disabled:
- run `npx convex dev` once to push backend state.
## Completion requirements
Before finishing, provide:
1. exact upstream docs commit date or latest retrieval timestamp
2. which package path was selected and why
3. list of changed files
4. commands the user should run next
Never claim setup is complete without showing these four outputs.
## Source links
- `https://github.com/get-convex/self-hosting`
- `https://raw.githubusercontent.com/get-convex/self-hosting/main/INTEGRATION.md`
- `https://github.com/get-convex/self-hosting?tab=readme-ov-file#manual-setup-1`
- `https://docs.convex.dev/llms.txt`
- `https://github.com/get-convex/convex-agent-plugins`
- `https://github.com/agentskills/agentskills`Related Skills
workos-convex-debug
Debug and troubleshoot WorkOS AuthKit authentication issues with Convex. Use when authentication fails, JWT validation errors occur, user identity returns null, email claims are missing, admin access checks fail, or sign in button does not work. Supports Netlify deployment.
workos-convex-auth
Set up and configure WorkOS AuthKit authentication with Convex backend. Use when integrating AuthKit, configuring JWT providers, setting up environment variables, or implementing sign in and sign out flows with React and Vite. Supports Netlify deployment.
convex-scale-optimization
Patterns for scaling read-heavy Convex apps to millions of users. Use when optimizing bandwidth, reducing query costs, fixing slow queries, creating digest tables, replacing reactive subscriptions with one-shot fetches, adding compound indexes, debouncing writes, rate-controlling backfills, or running npx convex insights. Trigger when users mention "scale", "bandwidth", "performance", "optimize", "slow queries", "expensive queries", "digest table", "denormalize", or "thundering herd" in the context of Convex.
convex-design-system
Convex UI component patterns from the live Storybook preview. Use when building React components, forms, modals, navigation, feedback states, or app layouts that should match the current Convex design system. Applies to both shared primitives and dashboard style product UI.
convex-return-validators
Guide for when to use and when not to use return validators in Convex functions. Use this skill whenever the user is writing Convex queries, mutations, or actions and needs guidance on return value validation. Also trigger when the user asks about Convex type safety, runtime validation, AI-generated Convex code, Convex AI rules, Convex security best practices, or when they're debugging return type issues in Convex functions. Trigger this skill when users mention "validators", "returns", "return type", or "exact types" in the context of Convex development. Also trigger when writing or reviewing Convex AI rules or prompts that instruct LLMs how to write Convex code.
convex-doctor
Static analysis checklist for Convex backends covering 72 rules across security, performance, correctness, schema, architecture, configuration, and client-side patterns. Use when writing, reviewing, or auditing Convex code. Trigger on mentions of "convex-doctor", "health score", "static analysis", "anti-patterns", "audit convex", or before shipping backend changes.
convex
Routes general Convex requests to the right project skill. Use when the user asks which Convex skill to use or gives an underspecified Convex app task.
convex-setup-auth
Sets up Convex auth, identity mapping, and access control. Use for login, auth providers, users tables, protected functions, or roles in a Convex app.
convex-quickstart
Creates or adds Convex to an app. Use for new Convex projects, npm create convex@latest, frontend setup, env vars, or the first npx convex dev run.
convex-performance-audit
Audits Convex performance for reads, subscriptions, write contention, and function limits. Use for slow features, insights findings, OCC conflicts, or read amplification.
convex-migration-helper
Plans Convex schema and data migrations with widen-migrate-narrow and @convex-dev/migrations. Use for breaking schema changes, backfills, table reshaping, or zero-downtime rollouts.
convex-create-component
Builds reusable Convex components with isolated tables and app-facing APIs. Use for new components, reusable backend modules, integrations, or component boundary work.