In this example we’ll create the pricing for a premium AI chatbot. We’re going to have:
  • A Free plan that gives users 5 chat messages per month for free
  • A Pro plan that gives users 100 chat messages per month for $20 per month.
Autumn provides React hooks and components for an easier developer experience. If you’re not using Typescript, have an unsupported framework or just prefer a backend-only setup for full control, use this guide.

​
1. Create your products

Create a product for each plan that your app offers. In our example we’ll create a “Free” and “Pro” product.
Run the following command in your root directory:
npx atmn init
This will prompt you to login or create an account, and create an autumn.config.ts file. Paste in the code below, or view our config schema to build your own.
autumn.config.ts
import {
  feature,
  product,
  featureItem,
  pricedFeatureItem,
  priceItem,
} from "atmn";

// Features
export const messages = feature({
  id: "messages",
  name: "Messages",
  type: "single_use",
});

// Products
export const free = product({
  id: "free",
  name: "Free",
  items: [
    // 5 messages per month
    featureItem({
      feature_id: messages.id,
      included_usage: 5,
      interval: "month",
    }),
  ],
});

export const pro = product({
  id: "pro",
  name: "Pro",
  items: [
    // 100 messages per month
    featureItem({
      feature_id: messages.id,
      included_usage: 100,
      interval: "month",
    }),
    // $20 per month
    priceItem({
      price: 20,
      interval: "month",
    }),
  ],
});
Then, push your changes to Autumn’s sandbox environment.
npx atmn push
If you already have products created in the dashboard, run npx atmn pull to pull them into your local config.

​
2. Stripe Payments

​
Checkout

Call the checkout function to get Stripe checkout page when the customer wants to purchase the Pro plan, and pass it to your frontend. Once they’ve paid, Autumn will grant them access to the features we defined. If their payment details are already on file, checkout data (eg, prices) will be returned instead to be displayed to the customer. This lets them confirm their upgrade, downgrade or new purchase.
Make sure you’ve pasted in your Stripe test secret key sk_test_... in the Autumn dashboard.
import { Autumn } from "autumn-js";

const autumn = new Autumn({ secretKey: "am_sk_..." });

const { data } = await autumn.checkout({
  customer_id: "internal_user_or_org_id_from_auth",
  product_id: "pro",
});

​
Attach

If the payment details are on file and the customer is ready to make the payment, use the attach function to enable the product (and charge the customer if applicable). 
import { Autumn } from "autumn-js";

const autumn = new Autumn({ secretKey: "am_sk_..." });

const { data } = await autumn.attach({
  customer_id: "internal_user_or_org_id_from_auth",
  product_id: "pro",
});

​
3. Build Pricing Logic

There are 3 key functions you need to handle the billing logic once the customer has purchased the Pro plan:
  • check for feature access to see if the customer is allowed to send a message.
  • track a usage event in Autumn
  • customer to fetch subscription and usage data.
You should handle feature access checks on the backend too for security. The server-side check function makes an API call to Autumn’s DB to fetch the latest information. 
import { Autumn as autumn } from "autumn-js";

// check feature access
const { data } = await autumn.check({
  customer_id: "user_123",
  feature_id: "messages",
});
if (!data.allowed) {
  console.log("No more messages!");
  return;
}

// ... your own function to send the message

// then record the usage in Autumn
await autumn.track({
  customer_id: "user_123",
  feature_id: "messages",
});

// fetch customer usage + billing data
const customer = await autumn.customers.get("user_123");
const messages = customer?.features.messages;
console.log("Remaining messages: " + messages?.balance);
Congrats 🎉 Nice! You’ve now integrated Autumn into your application. You can make pricing changes through the dashboard/CLI and it’ll automatically update in your app. Next steps: