SaaS Stripe Setup

CreateAppAI allows you to integrate Stripe for Payment processing in your SaaS application.

Configure Stripe

To use Stripe with your CreateAppAI-generated application, you'll need to set up your Stripe API keys. in .env (environment variables) file.

Where to find Stripe API key?

  1. Go to the Stripe dashboard.
  2. Click on the "Developers" section.
  3. Select "API Keys".
  4. You will see a list of your API keys, including both live mode and test mode keys.

Set Up Stripe API Keys in CreateAppAI

  1. Locate the .env (environment variables) file in your CreateAppAI-generated project.
  2. Add your Stripe API keys to the .env file.

Setup SaaS Pricing Plans

CreateAppAI allows you to visually configure SaaS Pricing plans and integrate them with Stripe.

  1. Decide on whether you want to offer one-time payments or recurring subscriptions.
  2. Create a new product in Stripe (Dashboard -> Products -> Add Product).
  3. Copy the Stripe Price API key for your product. (It will start with 'price_')
  4. Run your app in CreateAppAI (preview mode)
  5. Locate Subscription Plan menu item under the Admin section.
  6. Add your product and enter the Stripe Price API key in the Stripe Plan Id field.
  7. When you generate code for your app, CreateAppAI will create a plans.ts file based on your entries in Subscription Plan table. It is this file that is used by pricing page. You can locate the file in \app\(checkout)\checkout\_components folder.
  8. Customize the plans.ts file as needed to adjust the features for each pricing plan.

Checkout

Checkout is handled via Stripe Checkout. When a user selects 'Checkout', the CreateAppAI-generated code creates a Stripe Checkout Session and redirects the user to the Stripe-generated URL.You can find relevant code in app\(checkout)\checkout\_actions.tsx folder.

After the user completes the payment, the return call from Stripe is handled in the app\(checkout)\checkout-success\page.tsx file. The code retrieves the payment details from the Stripe Checkout Session and updates the database accordingly.

User Account Management

Stripe provides user account management functionality through the 'Customer Portal' (under Billing -> Portal). This allows users to self-manage their account and billing information.

When a user clicks 'Manage Account', the CreateAppAI-generated code creates a Stripe Billing Portal and redirects the user to the Stripe-generated URL. You can find the relevant code in the app\(protected)\(admin)\account\_actions.tsx.