Photo by S'well on Unsplash

How to Create a Subscription with Stripe Payment. Here’s the Subscription Made for You.

In this article, you will learn how to get a subscription ready, along with step-by-step example code; Product, Plan, Payment Method, Customer, and Subscription.

This article aims to explain how a subscription is created with Stripe Payment API. To completely understand the Subscription mechanism, you are required to understand how Stripe Webhook works too, which defines a subscription life cycle. It is a complicated topic so I am not going to write about it in this article, but I will in future posts.

With subscriptions, customers make recurring payments for access to a product. Subscriptions require you to retain more information about your customers than one-time purchases do because you need to automatically charge them in the future.

You can also check the Stripe doc for more details.

For this tutorial, I illustrated a flow of how you create a $20 monthly healthy meal plan. Through this, you will be able to understand how the subscription can be created with Stripe Payment API.

Product

Products describe the specific goods or services you offer to your customers. For example, you might offer a Standard and Premium version of your goods or service; each version would be a separate Product. They can be used in conjunction with Prices to configure pricing in Checkout and Subscriptions.

For example, let’s say you want to sell a Vegetable Box for a subscription, you need to register the product information first in Stripe Admin or via Stripe API.

const product = await stripe.products.create({
           name='Vegetable Box',
           statement_descriptor='Venetable Box'
})

That’s it. You now have a product called “Vegetable Box”. Next, let’s decide the price and frequency of a subscription interval, meaning how often a customer is billed and receives the Vegetable Box.

Plan

Plans define the base price, currency, and billing cycle for recurring purchases of products. Products explained above help you track inventory or provisioning, and plans help you track pricing.

For example, you can create a Healthy Subscription Plan that offers a vegetable box to a customer. To create a plan, you need to specify interval , currency , product , and amount . One plan is linked to one product.

const plan = await stripe.plans.create({
        currency='usd',
        interval='month',
        product='pro_xxxxx', this is the id of vegetable box product
        nickname='monthly heathly plan',
        amount=20,
        usage_type='licensed',
})

By setting usage_type to licensed , you will be billed as soon as the subscription starts. The interval is the frequency of how often a subscription is billed. You can specify day, week, month or year. In the example, this subscription is going to be billed “monthly” when the subscription begins.

Now a healthy plan is ready!

Next, in order to actually start a subscription, there are three more steps. Payment method, customer, and subscription need to be created.

Payment Method

PaymentMethod objects represent your customer’s payment instruments. They can be used with PaymentIntents to collect payments or saved to Customer objects to store instrument details for future payments.

To save a customer’s credit card, you need to collect the customer’s credit card at your checkout using Stripe Elements. Stripe Elements are rich, pre-built UI components that help you create your own checkout flows across desktop and mobile.

From there, customers enter their card information. Customers’ card information is collected and securely saved in Stripe, not in your server.

const card = elements.getElement(CardNumberElement);
const payload = await stripe.createPaymentMethod({
       type: 'card',
       card: card,
       billing_details: {
          name: shipping.name,
          phone: phone,
          address,
       },
});

After successful creation, you can get the payment method id by accessing it below. This id will be used in the next Customer section.

payload.paymentMethod.id 

If a customer saves multiple cards, then there would be multiple payment method ids that are attached to the customer.

Also, Stripe offers Apple Pay and Google Pay buttons. If you would like to implement that, you can go to their doc in detail. I also wrote a detailed article about how to test it before. You can check this too.

Tips on Google Pay and Apple Pay with Stripe

Customer

Customer objects allow you to perform recurring charges, and to track multiple charges, that are associated with the same customer

Creating a customer account and saving the customer’s card information is required when your service offers a subscription.

const customer = await stripe.customers.create({
        name: shipping.name,
        address: address,
        invoice_settings: {
            default_payment_method: paymentMethodID,
        },
        shipping: shipping,
})

default_payment_method is a customer’s default payment method.

After you collect a payment method, attach it to a customer as default_payment_method. When a subscription is billed, the default payment method is automatically used to be billed. If a subscribed customer saved multiple cards, the only one card, which is set to default_payment_method , is billed. When a customer changes a card used for a subscription, you need to update default_payment_method it to correctly bill the card too.

Subscription

Subscriptions allow you to charge a customer on a recurring basis

Creating a subscription requires a customer and a plan. In our example, we made a Healthy Plan, so you can get the plan id and set it to the subscription as well as a customer id.

const subscription = await stripe.subscriptions.create({
        customer: customerID,
        tax_percent: 8,
        items: [{ plan: plan.id, quantity: 1 }],
        coupon: coupon
})

You can add multiple plans to a subscription too. But in our example, let’s just buy one Healthy Plan with a quantity of 1. If you add multiple plans, you will be billed multiple times according to plan interval and amount.

In addition, there are optional items you can add too. For example, if you want to apply a discount on a subscription, you can create a coupon from the Stripe dashboard or via Stripe API, and attach it to the subscription.

I also wrote a detailed article about the coupon before, so if you are curious about learning how a coupon on a subscription works, you can check that too.

Stripe Subscription Payment: Create and Apply Coupon for Subscription

Now when a customer purchases the Healthy Plan, the customer will be billed monthly with the price of 20 dollars.

Closing Thoughts

I showed you how you can get started with Stripe Subscription. Unlike one-time purchases, it is a bit difficult especially if you are new to Stripe as you need to create a customer, plan, product, and subscription. Learning cost is maybe high, but Stripe amazingly simplifies it all, a beginner can get ready quickly. I hope my artcile helps you grasp how it works.

If you have any comments, please drop your comment. Also, please feel free to subscribe to my learning journey if you’d like to. I am in a startup for the first time right now, and I am sharing things I learned.

I am in the middle of writing other articles related to e-commerce and payment too right now, so please free to follow me to get notified instantly when my future articles are ready. My account’s theme is e-commerce, payment, and productivity.