Generated banner for Convex Billing
Generated logo for Convex Billing

Convex Billing

ConvexOfficialPublished by Convex

  • Skill
  • Tool integration
  • Software development
  • Apache-2.0
  • No issues found

From the author

Add Stripe billing/payments to the Convex app via @convex-dev/stripe (checkout + webhook + gating).
— the description by Convex

AutoGineer summary

Written by AutoGineer from the skill’s own files, not by the author

This skill provides a structured approach to integrating Stripe payments into a Convex application. It leverages the @convex-dev/stripe component to handle the complexities of checkout sessions, webhook signature verification, and subscription state management. By following this guide, developers can securely gate application features based on server-side subscription status, ensuring a reliable billing workflow within the Convex ecosystem.

What it does

  • Installs and configures the @convex-dev/stripe component.
  • Sets up secure webhook routes for Stripe event handling.
  • Manages customer creation and checkout session generation.
  • Implements server-side gating to verify user subscription status.
  • Automates webhook signature verification via the component.
  • Provides patterns for storing and retrieving subscription data.

When to use it

  • When you need to add subscription-based billing to a Convex app.
  • When you want to avoid writing custom Stripe webhook signature verification logic.
  • When you need to gate application features based on active subscription status.
  • When you are using Convex and want to follow official component integration patterns.

Advantages

  • Reduces boilerplate by using a pre-built component for Stripe integration.
  • Ensures secure webhook handling with built-in signature verification.
  • Centralizes subscription state management within Convex tables.
  • Simplifies the developer experience for managing Stripe keys and environment variables.

Usage examples

“How do I set up Stripe checkout in my Convex project?”
The agent will guide you through installing @convex-dev/stripe, configuring the component in convex.config.ts, and implementing a checkout action in your backend.
“How can I check if a user has an active subscription in Convex?”
The agent will provide a query implementation that uses the component's subscription state to return a boolean status for the authenticated user.

Install

  1. Download the skill as a ZIP:

    https://mp-staging.autogineer.com/agent-skills/convex/convex-billing/download
  2. Unzip it into the cross-client skills folder of your project:

    mkdir -p .agents/skills && unzip convex-billing.zip -d .agents/skills

Documentation by Convex

<!-- GENERATED from convex-agents content/capabilities/billing.json — do not edit by hand. -->

Add billing / payments

Wire Stripe to Convex using @convex-dev/stripe: a checkout action, an httpAction webhook registered by the component (signature-verified automatically), subscription state stored in the component's tables, and server-side gating via a query.

Workflow

  1. Install the component: npm install @convex-dev/stripe.

  2. Create convex/convex.config.ts:

    import { defineApp } from 'convex/server';
    import stripe from '@convex-dev/stripe/convex.config.js';
    const app = defineApp();
    app.use(stripe);
    export default app;
  3. Store Stripe keys in Convex env (use the env micro power): STRIPE_SECRET_KEY (sk_test_… / sk_live_…) and STRIPE_WEBHOOK_SECRET (whsec_…).

  4. Create convex/http.ts to register the webhook route (the component handles signature verification automatically):

    import { httpRouter } from 'convex/server';
    import { components } from './_generated/api';
    import { registerRoutes } from '@convex-dev/stripe';
    const http = httpRouter();
    registerRoutes(http, components.stripe, { webhookPath: '/stripe/webhook' });
    export default http;
  5. Create convex/billing.ts with a checkout action and a subscription-gate query:

    import { action, query } from './_generated/server';
    import { components } from './_generated/api';
    import { StripeSubscriptions } from '@convex-dev/stripe';
    import { v } from 'convex/values';
    const stripeClient = new StripeSubscriptions(components.stripe, {});
    export const createSubscriptionCheckout = action({
      args: { priceId: v.string() },
      returns: v.object({ sessionId: v.string(), url: v.union(v.string(), v.null()) }),
      handler: async (ctx, args) => {
        const identity = await ctx.auth.getUserIdentity();
        if (!identity) throw new Error('Not authenticated');
        const customer = await stripeClient.getOrCreateCustomer(ctx, { userId: identity.subject, email: identity.email, name: identity.name });
        return await stripeClient.createCheckoutSession(ctx, { priceId: args.priceId, customerId: customer.customerId, mode: 'subscription', successUrl: `${process.env.SITE_URL ?? 'http://localhost:3000'}/?success=true`, cancelUrl: `${process.env.SITE_URL ?? 'http://localhost:3000'}/?canceled=true`, subscriptionMetadata: { userId: identity.subject } });
      },
    });
    export const isSubscribed = query({
      args: {},
      returns: v.boolean(),
      handler: async (ctx) => {
        const identity = await ctx.auth.getUserIdentity();
        if (!identity) return false;
        const subscriptions = await ctx.runQuery(components.stripe.public.listSubscriptionsByUserId, { userId: identity.subject });
        return subscriptions.some((sub) => sub.status === 'active' || sub.status === 'trialing');
      },
    });
  6. Run npx convex dev --once — it will install the component and push the functions. Verify output shows ✔ Installed component stripe.

  7. In Stripe Dashboard → Webhooks: add endpoint https://<deployment>.convex.site/stripe/webhook, subscribe to checkout.session.completed, customer.subscription.*, invoice.*, payment_intent.*. Copy the signing secret as STRIPE_WEBHOOK_SECRET.

Rules

  • Use @convex-dev/stripe (npm: @convex-dev/stripe@^0.1.4) — it handles webhook signature verification internally via registerRoutes; do NOT write a manual constructEvent webhook.

  • Stripe keys live in Convex env (use the env micro power): STRIPE_SECRET_KEY and STRIPE_WEBHOOK_SECRET.

  • Gate on server-stored subscription state via isSubscribed query (reads component tables), not client claims.

  • convex/convex.config.ts must import from '@convex-dev/stripe/convex.config.js' (not .ts) — the .js extension is required by the Convex bundler.

Files

Requirements and compatibility

Works with: Claude Code, Claude apps, OpenAI Codex, GitHub Copilot, Cursor, Gemini CLI, Kiro, OpenCode, Goose, Amp, Roo Code, JetBrains Junie, Factory Droid, Devin (ex-Windsurf), Mistral Vibe, OpenHands, Letta

“Works with” means the tool reads the open Agent Skills format; a skill written for one tool may use features others lack.

Needs: Needs Node.js

Security

No issues found by our static scan· No issues found

A static scan is not a guarantee. Skills are third-party content: review a skill before you let an agent use it.

Attribution and licence

Published by
Convex
Publisher
Convex (Official)
Source
convex/agent-skills · skills/convex-billing · commit f60629d
Licence
Apache License 2.0 (redistribution allowed)
  • LICENSE (added by AutoGineer from LICENSE)
  • ATTRIBUTION.md (written by AutoGineer)
Synced

AutoGineer is not affiliated with or endorsed by Convex.

Download ZIP

The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download convex-billing.zip