Skip to main content

Overview

Accept payments in your Stardeck applications using popular payment gateways like Stripe and Omise. This guide covers setting up payment accounts, configuring API keys in Stardeck, and using the AI agent to build payment features including credit card processing, Thai QR payments (PromptPay), and webhook handling.
This guide focuses on test account setup and configuration. You can use Stardeck’s AI agent to build the entire payment integration—no coding required.

Prerequisites

Before you begin, ensure you have:
  • An active Stardeck project
  • Familiarity with environment variables in Stardeck
  • A payment gateway account (Stripe and/or Omise)

Setting Up Stripe

Stripe is a popular payment processor supporting credit cards, digital wallets, and more.

Creating a Stripe Test Account

  1. Go to stripe.com and click Sign up
  2. Complete the registration process
  3. Once logged in, you’ll automatically have access to test mode

Getting Your API Keys

  1. In the Stripe Dashboard, navigate to Developers > API keys
  2. Toggle Test mode on (switch in the left sidebar should show “Test mode”)
  3. You’ll see two types of keys:
    • Publishable key - Starts with pk_test_... (safe to expose in client-side code)
    • Secret key - Starts with sk_test_... (must be kept secure)
Never expose your secret key in client-side code. Always mark it as a secret in Stardeck’s environment variables.

Enabling Payment Methods

  1. Go to Settings > Payment methods
  2. Ensure Cards is enabled
  3. For webhook integration, note down your Webhook signing secret from Developers > Webhooks
Stripe test mode provides test card numbers for different scenarios. You can find these in Stripe’s testing documentation.

Setting Up Omise

Omise is a Southeast Asian payment gateway with excellent support for Thai payment methods including PromptPay QR codes.

Creating an Omise Test Account

  1. Go to omise.co and click Sign up
  2. Complete the registration and email verification
  3. Access your dashboard at dashboard.omise.co
  4. Switch to Test mode using the toggle in the top navigation

Getting Your API Keys

  1. In the Omise Dashboard, click on your account name (top right)
  2. Go to Keys or API Keys section
  3. In Test mode, you’ll find:
    • Public key - Starts with pkey_test_... (client-side safe)
    • Secret key - Starts with skey_test_... (server-side only)

Enabling Payment Methods

  1. Navigate to Settings > Payment Methods
  2. Enable the following for testing:
    • Credit/Debit Cards
    • PromptPay (Thai QR code payments)
  3. Save your settings
Omise provides test card numbers and QR payment flows for sandbox testing. Check their documentation for test credentials.

Configuring Environment Variables in Stardeck

Once you have your API keys, add them to your Stardeck project as environment variables.

Adding Stripe Keys

  1. Open your project in the Stardeck dashboard
  2. Click the Settings button (gear icon)
  3. Navigate to the Environment Variables tab
  4. Add the following variables:

Stripe Publishable Key (Non-Secret)

  • Key: STRIPE_PUBLISHABLE_KEY
  • Value: Your pk_test_... key
  • Secret Variable: Off (unchecked)
  • Deployment Targets: Select Sandbox for testing
Non-secret variables are automatically available with the VITE_ prefix for client-side code. Your frontend can access this as import.meta.env.VITE_STRIPE_PUBLISHABLE_KEY.

Stripe Secret Key (Secret)

  • Key: STRIPE_SECRET_KEY
  • Value: Your sk_test_... key
  • Secret Variable: On (checked)
  • Deployment Targets: Select Sandbox for testing

Stripe Webhook Secret (Secret)

If you plan to use webhooks:
  • Key: STRIPE_WEBHOOK_SECRET
  • Value: Your whsec_... key from Stripe webhooks page
  • Secret Variable: On (checked)
  • Deployment Targets: Select Sandbox for testing

Adding Omise Keys

Follow the same process to add Omise keys:

Omise Public Key (Non-Secret)

  • Key: OMISE_PUBLIC_KEY
  • Value: Your pkey_test_... key
  • Secret Variable: Off (unchecked)
  • Deployment Targets: Select Sandbox

Omise Secret Key (Secret)

  • Key: OMISE_SECRET_KEY
  • Value: Your skey_test_... key
  • Secret Variable: On (checked)
  • Deployment Targets: Select Sandbox

Using the AI Agent to Build Payment Features

Now that your environment is configured, you can use Stardeck’s AI agent to build your payment integration. Here are example prompts for common scenarios:

E-commerce Checkout with Stripe

I need a checkout flow for my art marketplace where customers can buy artwork with credit cards.

Requirements:
- Payment form with card details using Stripe
- Show the artwork image, title, and price before payment
- Use STRIPE_PUBLISHABLE_KEY and STRIPE_SECRET_KEY environment variables
- Send confirmation email after successful payment

Subscription Payments with Webhooks

Add subscription billing for my SaaS app using Stripe.

Requirements:
- Monthly and annual subscription plans at $29/mo and $290/year
- Use Stripe webhooks with STRIPE_WEBHOOK_SECRET to track payment status
- Update user subscription status in the database when payments succeed or fail
- Show subscription status in user's account page

Thai Payment Gateway for Local Business

I run a Thai restaurant and need to accept payments in Thai Baht with both credit cards and PromptPay QR codes using Omise.

Requirements:
- Payment page with Credit Card and PromptPay options
- Use OMISE_PUBLIC_KEY and OMISE_SECRET_KEY
- Display QR code for PromptPay and wait for payment confirmation
- Store orders in database with payment status

Order Management Dashboard

Create an admin dashboard to manage customer orders and payments for my online store.

Requirements:
- Show all orders with payment status, customer details, and amounts
- Filter by order status and date
- Display total revenue and number of orders
- Allow me to issue refunds through Stripe

Tips for Effective Prompting

  1. Reference your environment variables by name - The agent knows how to use them correctly
  2. Specify currency - Mention THB for Omise or USD for Stripe
  3. Request database storage - Specify what payment data should be saved
  4. Keep it simple - The agent will handle best practices for security and error handling
The AI agent understands payment gateway APIs and will implement secure, production-ready code following best practices.

Testing Your Integration

Testing Stripe Payments

Stripe provides test card numbers for different scenarios:
  • Successful payment: 4242 4242 4242 4242
  • Requires authentication: 4000 0025 0000 3155
  • Declined card: 4000 0000 0000 9995
Use any future expiry date and any 3-digit CVC.
Find more test cards in Stripe’s testing documentation.

Testing Omise Payments

Omise provides test cards for different scenarios:
  • Successful charge: 4242 4242 4242 4242
  • Failed charge: 4111 1111 1111 1111
  • PromptPay QR: Test mode generates a test QR code that auto-completes after a few seconds
Use expiry date 10/25 and any 3-digit CVV for test cards.

Testing Webhooks Locally

For webhook testing during development:
  1. Use tools like ngrok or localtunnel to expose your local dev server
  2. Configure the webhook URL in Stripe/Omise dashboard pointing to your exposed endpoint
  3. Trigger test events from the payment gateway dashboard
  4. Monitor webhook events in your application logs
Webhook endpoints must return a 200 OK response quickly to avoid retries. Process events asynchronously if needed.

Going Live with Production Keys

When you’re ready to accept real payments:

Moving to Production

  1. Get production API keys from Stripe/Omise (requires business verification)
  2. In Stardeck, add new environment variables with production keys
  3. Set Deployment Targets to Production (not Sandbox)
  4. Update webhook URLs to point to your production domain
  5. Test thoroughly with small real transactions before launch

Production Checklist

  • Business verification completed with payment gateway
  • Production API keys configured in Stardeck
  • Webhook endpoints verified and tested
  • Error handling and logging in place
  • Payment confirmation emails configured
  • Refund process documented
  • Terms of service and privacy policy updated
  • PCI compliance requirements reviewed
Production keys give access to real payment processing. Keep them secure and never commit them to version control.

Additional Resources

Stripe Documentation

Omise Documentation


Need help with your payment integration? Contact our support team through your dashboard or reach out to [email protected].