skills.rest
mrisoli
mrisoliCOMMUNITY
Explore all skills by this author →
Website𝕏@mgrisoliGitHub

convex-create-component

Creates reusable Convex components with isolated tables and app-facing APIs.

Updated May 28, 2026
Search Tags:#typescript#backend#schema#component#codegen#convex#reusable modules
One-click install
npx skills add https://github.com/mrisoli/pokerhouse --skill convex-create-component-mrisoli
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: convex-create-component
Source: https://github.com/mrisoli/pokerhouse/tree/main/packages/backend/.agents/skills/convex-create-component
Command: npx skills add https://github.com/mrisoli/pokerhouse --skill convex-create-component-mrisoli

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Building reusable backend modules in Convex requires careful handling of component boundaries, isolated tables, and app-facing APIs, and mistakes around auth, environment variables, or ID types cause subtle failures. This Skill guides the design and implementation of Convex components with correct boundaries from the start. ## Core Features & Use Cases - Component Scaffolding: Creates the full component structure with convex.config.ts, schema.ts, and function files using the component's own generated server imports. - Boundary Enforcement: Keeps authentication, environment access, and HTTP route mounting in the app while passing parent IDs across the boundary as strings. - Shape Selection: Chooses between local, packaged, or hybrid component layouts using dedicated reference guides for each path. - Use Case: You want to extract notification logic into a reusable module. The Skill creates a notifications component with its own tables and functions, wires it into the app with app.use(...), and adds app-side wrapper mutations that handle auth before calling the component. ## Quick Start Ask the assistant to create a Convex component for your feature, describing what tables and public functions it should expose.

Frequently Asked Questions about convex-create-component

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a reusable Convex component?▼

Define the component with defineComponent in its own convex.config.ts under convex/components/<name>/, add a schema.ts and function files, then install it from the app's convex/convex.config.ts using defineApp and app.use. Run npx convex dev to generate the component's own _generated files.

Should I build a local or packaged Convex component?▼

Choose a local component when it only serves the current app and you want the simplest path. Choose a packaged component when you need to publish to npm or share across multiple apps, using npx create-convex --component as the starting point.

Can Convex components access ctx.auth or process.env?▼

No, component functions cannot access ctx.auth or process.env. The app must resolve authentication and environment variables, then pass explicit values like userId and API keys as arguments across the component boundary.

Why can't I use v.id for app tables inside a Convex component?▼

Components have no access to the app's table namespace, so v.id("parentTable") is invalid in component args or schema. Parent app IDs must cross the boundary as v.string() because Id types become plain strings in the ComponentApi.

How do clients call functions inside a Convex component?▼

Component functions are not directly callable by clients. Create app-side wrapper queries or mutations that handle auth, then invoke the component through ctx.runQuery or ctx.runMutation using components.<name> references.

Why does pagination fail across the Convex component boundary?▼

The built-in .paginate() does not work across component boundaries. Use the paginator helper from convex-helpers inside the component when the component needs to return paginated results.

Related Skills

Explore More Software Engineering Skills→
MichaelFriezeMichaelFrieze

convex-quickstart

Sets up a Convex backend for new or existing web apps.

Community
Intermediate
atemagueratemaguer

convex-setup

Integrate a real-time Convex backend into Expo or Next.js apps.

Community
Advanced
PolarCoding85PolarCoding85
17

convex-components

Provide reusable component patterns for Convex backend apps.

Community
Advanced
featurectrlfeaturectrl

convex-create-component

Create Convex components with isolated tables and app-facing APIs.

Official
Advanced