Payment (Polar)

The guide walks you through the process of adding Polar payments with Better Auth in a TanStack Start project. You will set up the required environment values, connect your webhook, create your products, and connect everything to your project so your payment flow works from end to end.

1. Set your environment variables

POLAR_ACCESS_TOKEN=
POLAR_WEBHOOK_SECRET=

2. Set webhook to polar

3. Configure the Subscriptions

Create your products and tiers inside the Polar dashboard. This produces the unique product ids needed for your subscription flow.

Copy these ids into your project config file to link your subscription logic with Polar.

// src/features/payments/polar/data.ts
export const subscriptionPlans = [
    {
        slug: "starter-monthly",
        productId: "xxxxxxxx-...",
        name: "Starter",
        //...
    },
    //...
];

4. Pricing Component

The pricing component presents your available plans and guides the visitor through the full subscription flow based on the values you placed in your subscription settings.

import { Pricing } from "@/components/payments/polar/Pricing";

<Pricing />;