Stripe Payments

Ready to accept payments? Stripe is the world's leading payment platform, trusted by millions of businesses. Connect your Stripe account and the AI will build real, working payment flows for you — no payment experience required!

What Can You Build?

Getting Started: 4 Easy Steps

Step 1: Create a Free Stripe Account & Get Your API Keys

1. Go to stripe.com
2. Click "Start now" — it's free to create an account
3. Complete the basic signup (you can verify your identity later when going live)
4. Go to dashboard.stripe.com/apikeys
5. Copy your Secret key (starts with sk_test_)
6. Copy your Publishable key (starts with pk_test_)

Step 2: Connect Supabase First

If you haven't connected Supabase yet, see the Supabase Integration guide first.

Step 3: Add Your Stripe Keys to Your Project

1. Open your project in IndigiCoder
2. Click the gear icon (⚙️) to open Project Settings
3. Find the Stripe card
4. Enter your Secret Key (from Step 1)
5. Enter your Publishable Key (from Step 1)
6. Click "Connect Stripe"
7. Done! You'll see "Connected" with your key mode (Test or Live)

Step 4: Tell the AI What to Build

Now just describe what payments you want:

How It Works

The AI Creates Everything You Need

When you ask for payments, the AI automatically:

• ✅ Creates products and prices in your Stripe account
• ✅ Builds secure checkout using Stripe's hosted checkout page
• ✅ Creates success and cancel pages
• ✅ Sets up the backend (Edge Functions) to handle payments securely
• ✅ Stores order/subscription data in your database

The Payment Flow

1. Customer clicks "Buy" or "Subscribe"
2. Redirected to Stripe's secure checkout (your site never sees card details)
3. Customer enters payment info on Stripe
4. Redirected back to your success page
5. Order/subscription saved to your database

Testing Your Payments

Use these test card numbers to simulate payments:

For expiry date, use any future date (e.g., 12/34). For CVC, use any 3 digits.

Payment Scenarios Explained

Scenario 1: Simple One-Time Purchase

Best for: Digital products, services, one-off payments

The AI creates a Stripe product with a fixed price and a simple checkout button.

Scenario 2: E-commerce (Shopping Cart)

Best for: Online stores with multiple products

The AI creates a cart-based checkout that supports multiple items with varying quantities. Prices come from your database.

Scenario 3: Subscriptions

Best for: SaaS, memberships, recurring billing

The AI creates recurring products, a pricing page, and sets up webhooks to track subscription status (renewals, cancellations, etc.).

Scenario 4: Donations / Pay What You Want

Best for: Donations, tips, flexible pricing

The AI creates a dynamic checkout where customers choose their own amount.

After Deployment

Payments work in the deployed version of your app, not in the preview. Here's what to expect:

Testing After Deployment

1. Deploy your project to IndigiCoder or download and host elsewhere
2. Visit your live site
3. Click the checkout button
4. Use test card 4242 4242 4242 4242
5. Complete the payment — you'll see it in your Stripe Dashboard!

Going Live (Real Payments)

When you're ready to accept real payments:

1. Complete your Stripe account verification (identity, business details) in the Stripe Dashboard
2. Go to dashboard.stripe.com/apikeys
3. Copy your live keys (sk_live_... and pk_live_...)
4. In your IndigiCoder project, open Project Settings (gear icon)
5. Disconnect the current Stripe connection
6. Reconnect with your live keys
7. Redeploy your project
8. You're now accepting real payments!

Viewing Your Payments

All payments appear in your Stripe Dashboard. You can:

• See all payments, subscriptions, and customers
• Issue refunds
• View analytics and reports
• Export data for accounting
• Manage disputes

Troubleshooting

Checkout isn't working in preview

That's expected! Stripe payments require deployment because they need a real server to process securely. Deploy your project first, then test.

I see "Stripe not connected"

Make sure you've connected Stripe in your Project Settings (gear icon). Also verify that Supabase is connected first — Stripe requires Supabase for Edge Functions.

Payment succeeded but nothing saved to database

Make sure Supabase is also connected. The AI saves order data to your Supabase database. If Supabase isn't linked, there's nowhere to store the data!

Subscriptions not tracking renewals

You need to configure the webhook secret. The AI should have guided you through this. Go to your Stripe Dashboard → Developers → Webhooks and make sure the endpoint is set up.

Frequently Asked Questions

What fees does Stripe charge?

Stripe charges 2.9% + 30¢ per successful card payment (in the US). There are no monthly fees. See Stripe's pricing for details.

Can I offer discounts or coupons?

Yes! Just ask the AI: "Add a coupon code field to checkout". You'll create the actual coupon codes in your Stripe Dashboard.

How do refunds work?

Issue refunds directly in your Stripe Dashboard. The AI can also add refund functionality to your app if you ask.

Do I need Supabase for Stripe?

Technically no, but we highly recommend it. Without Supabase, there's no database to store orders or track subscription status. Most payment features work best with both connected.

Is my customer's payment info secure?

Absolutely! Your app never sees credit card numbers. Customers enter payment details directly on Stripe's PCI-compliant checkout page. Your Stripe keys are encrypted in IndigiCoder and never exposed in client code.