Vibe Coding Prompts
Stop writing boilerplate. Use these prompts with your favorite AI agent (Cursor, Windsurf, Bolt, etc.) to integrate Paymint in seconds.
Quick Setup (Next.js)
1. The “Full Integration” Prompt
Use this to set up the core API route and the Paymint Provider.
"I want to integrate Paymint for subscription billing using the @paymint/nextjs SDK.
Please refer to the documentation at https://docs.paymint.dev/sdks/nextjs for the latest API reference.
1. Create a dynamic API route at 'app/api/billing/[...path]/route.ts' using 'nextRouteHandler' from '@paymint/nextjs/server'.
2. Integrate Clerk for authentication to get the customer email securely from the session.
3. Wrap the application in 'PaymintProvider' in 'app/providers.tsx', setting the 'apiRoute' to '/api/billing'."
2. The “Pricing Page” Prompt
Use this to generate a high-converting pricing UI that connects to Paymint.
"Create a pricing page component for my Next.js app using Tailwind CSS.
Refer to the @paymint/nextjs hooks documentation at https://docs.paymint.dev/sdks/nextjs#hooks.
Use 'useBilling' to fetch products and 'useCheckout' for the payment flow.
Map through 'products' and display pricing cards with 'product.name', 'product.description', and 'price.unitPrice'.
Add a 'Subscribe' button that calls 'openCheckout(price.id)' when clicked.
Make the design feel premium with subtle micro-animations and hover effects."
Advanced Actions
3. The “Customer Portal” Prompt
Help users manage their own subscriptions.
"Create a 'Manage Subscription' section for the user dashboard.
Refer to the 'useSubscription' documentation at https://docs.paymint.dev/sdks/nextjs#usesubscription.
Show the current 'subscription.productName' and status.
Add action buttons for 'cancel', 'pause', and 'resume'.
Ensure to handle 'isMutating' state to show loading spinners on buttons during the request."
4. The “Success Verification” Prompt
Verify the payment on a success page.
"Create a server-side success page at 'app/checkout/success/page.tsx'.
Use 'PaymintServer' (refer to https://docs.paymint.dev/sdks/nextjs#server-side-usage) to fetch the latest billing state for the user's email.
If 'billing.hasActiveSubscription' is true, show a success message with the product name.
Otherwise, show a 'Processing payment...' message and suggest a page refresh."
Pro Tip: You can copy-paste these directly into your AI coding assistant. Make sure your PAYMINT_API_KEY is already in your .env.local file!
