skills.rest
Albo-Club
Albo-ClubOFFICIAL
Explore all skills by this author →
WebsiteGitHub

convex-create-component

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

Updated May 26, 2026
Search Tags:#typescript#code generation#backend#schema#component#convex#npm package
One-click install
npx skills add https://github.com/Albo-Club/albo-os --skill convex-create-component-albo-club
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: convex-create-component
Source: https://github.com/Albo-Club/albo-os/tree/main/.agents/skills/convex-create-component
Command: npx skills add https://github.com/Albo-Club/albo-os --skill convex-create-component-albo-club

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Building reusable backend modules in Convex requires strict boundary rules that are easy to get wrong: components cannot access app auth, environment variables, or parent table IDs, and their functions cannot be called directly by clients. This Skill guides the design and implementation of Convex components so the tables, public API, and app-side wrappers are structured correctly from the start. ## Core Features & Use Cases - Component Scaffolding: Creates the 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: Supports local, packaged (npm-published), and hybrid component layouts with dedicated reference guides for each. - Use Case: You want to extract notification logic into a reusable module. The Skill plans the tables and public functions, builds the component under convex/components/notifications/, wires it into the app with app.use(...), and creates authenticated app-side wrapper mutations for client access. ## Quick Start Ask the assistant to create a Convex component for your feature, describing what tables it should own and what functions the app needs to call.

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?▼

Default to a local component when it only serves the current app and does not need publishing. Choose a packaged component when you want to publish to npm or share it across multiple apps, starting from npx create-convex with the component flag.

Can Convex components access ctx.auth or environment variables?▼

No, component functions cannot use ctx.auth or read process.env. The app must resolve authentication and environment values, then pass them explicitly as arguments when calling the component through ctx.runQuery, ctx.runMutation, or ctx.runAction.

Why can't clients call Convex component functions directly?▼

Component functions are internal and lack the auth and environment wiring the app provides. Create app-side wrapper queries or mutations that resolve the user identity and then invoke the component through components.<name> references.

How do I pass parent app document IDs into a Convex component?▼

Pass parent app IDs as plain strings using v.string() validators, because Id types become strings in the app-facing ComponentApi. Do not use v.id("parentTable") since the component has no access to the app's table namespace.

Why does pagination fail across the Convex component boundary?▼

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

Related Skills

Explore More Software Engineering Skills→
agnivonagnivon

convex-create-component

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

Community
Advanced
aaravminaaravmin
1

clerk-tanstack-patterns

Integrate Clerk authentication into React apps with route guards and client hooks.

Community
Intermediate
waynesuttonwaynesutton
401

convex-security-audit

Audit Convex applications for authorization, data access, and rate limiting patterns.

Community
Advanced
featurectrlfeaturectrl

convex-create-component

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

Official
Advanced