convex-create-component

Build reusable Convex components with isolated tables and validated APIs.

Updated May 22, 2026

Search Tags:#type safety #components #schema #codegen #database functions #convex #auth boundary

Ready to run

npx skills add https://github.com/ekawijayasusilo/kmp_template --skill convex-create-component-ekawijayasusilo

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: convex-create-component
Source: https://github.com/ekawijayasusilo/kmp_template/tree/main/.claude/skills/convex-create-component
Command: npx skills add https://github.com/ekawijayasusilo/kmp_template --skill convex-create-component-ekawijayasusilo

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It helps teams create reusable Convex components that own their data and backend logic, while exposing a small, app-facing API with the right auth and environment wiring.

Core Features & Use Cases

Reusable component boundaries: isolate tables and functions inside convex/components/<name>/ to avoid mixing app logic with shared backend workflows.
Explicit, safe API contracts: define args and returns validators for every public component function to keep type contracts clear across the boundary.
App-side client access: create wrapper queries/mutations/actions in the app so clients never call component functions directly (auth/env access stays in the app).
Correct codegen wiring: ensure component imports come from the component’s own ./_generated/server and integrate via app.use(...).

Quick Start

Ask for the feature goal, then create a new local Convex component under convex/components/<componentName>/ and wire it into the app by installing it in convex/convex.config.ts with app.use(...), leaving auth/env and any client-facing wrappers in the app.

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 reusable Convex components with isolated database tables?▼

To create reusable Convex components, isolate tables and functions inside `convex/components/<name>/` and install them via `app.use(...)` in `convex.config.ts`, ensuring each component owns its schema and internal functions separately from app logic.

How do I enforce type safety for Convex component API boundaries?▼

Enforce type safety at the component boundary by defining explicit `args` and `returns` validators for every public component function, keeping type contracts clear and safe across the app-facing API.

Why should clients not call Convex component functions directly?▼

Clients should not call component functions directly because auth and environment access must stay in the app. Create wrapper queries, mutations, or actions in the app to manage client access and security boundaries.

How do I wire up Convex component codegen imports correctly?▼

Wire up codegen correctly by ensuring component imports come from the component's own `./_generated/server` path, then validate the integration by running `npx convex dev` to generate and verify the required server modules.

When should I extract backend logic into a standalone Convex component?▼

Extract backend logic into a standalone Convex component when you need to share durable workflows or reusable backend logic, ensuring each component owns its schema, internal functions, and public API contracts independently.

Can I use Convex components to package integrations for sharing across projects?▼

Yes, Convex components are designed for integration packaging and sharing backend logic. By isolating tables and exposing a small, well-scoped app-facing API, components can be reused across different Convex projects.