Blog
/
Guides & Tutorials

Forkable app template: usage-based billing for public Shopify apps

Published
June 22, 2023
Last updated
May 10, 2024
Learn how usage-based subscription billing can be implemented for public Shopify apps when building with Gadget.

Setting up billing for your public Shopify app can be a daunting task. To give you a head start when building apps for the Shopify App Store, we’re releasing additional forkable apps with Shopify billing built-in.

To make sure that we captured the nitty-gritty details that go into working with the Shopify Billing API, we worked with the Optiz.io team, who have released both public and custom apps, to build a series of forkable sample apps that incorporate usage-based billing into different subscription models.

Billing template #1: monthly subscription with usage-based charges

The first of these app templates can be forked here: https://app.gadget.dev/auth/fork?domain=shopify-billing-recurring-usage-v2--development.gadget.app

Included in this app:

  • Two sample plans: Lite and Pro Plans which have a monthly subscription cost as well as a usage-based percentage of every Order
  • Shopify’s Billing redirection: select a plan, get redirected to Shopify’s billing page, and then return to the billing page after accepting charges
  • Free trial management: To ensure that merchants don’t uninstall and reinstall your app to abuse a free trial period, the number of days is stored in the Gadget database and linked to the store

Get started now!

All you need to do to get started is set up a Shopify Partners connection in Gadget and install your app on a development store. 

There are two steps you want to make sure you take when setting up the connection:

  1. Don’t forget to select the Shopify App Store (or public) app distribution in the Partners dashboard before installing! 
  2. This sample also includes usage-based charges of merchants for a percentage of each order, depending on the selected plan. Because this app will need to subscribe to orders webhooks, you’ll need to fill out the Protected customer data access form, also located in the Partners dashboard.

The app’s Home page, powered by the <inline-code>Readme.md<inline-code> file in the project root, has step-by-step instructions for setting up the connection. Check out the following “Under the hood” section for more details on implementation and the billing flow.

Have questions?

Join our developer Discord to chat with the Gadget team and the community!

Riley Draward
Author
Reviewer
Try Gadget
See the difference a full-stack development platform can make.
Create app
No items found.

Forkable app template: usage-based billing for public Shopify apps

Learn how usage-based subscription billing can be implemented for public Shopify apps when building with Gadget.
Problem
Solution
Result

Setting up billing for your public Shopify app can be a daunting task. To give you a head start when building apps for the Shopify App Store, we’re releasing additional forkable apps with Shopify billing built-in.

To make sure that we captured the nitty-gritty details that go into working with the Shopify Billing API, we worked with the Optiz.io team, who have released both public and custom apps, to build a series of forkable sample apps that incorporate usage-based billing into different subscription models.

Billing template #1: monthly subscription with usage-based charges

The first of these app templates can be forked here: https://app.gadget.dev/auth/fork?domain=shopify-billing-recurring-usage-v2--development.gadget.app

Included in this app:

  • Two sample plans: Lite and Pro Plans which have a monthly subscription cost as well as a usage-based percentage of every Order
  • Shopify’s Billing redirection: select a plan, get redirected to Shopify’s billing page, and then return to the billing page after accepting charges
  • Free trial management: To ensure that merchants don’t uninstall and reinstall your app to abuse a free trial period, the number of days is stored in the Gadget database and linked to the store

Get started now!

All you need to do to get started is set up a Shopify Partners connection in Gadget and install your app on a development store. 

There are two steps you want to make sure you take when setting up the connection:

  1. Don’t forget to select the Shopify App Store (or public) app distribution in the Partners dashboard before installing! 
  2. This sample also includes usage-based charges of merchants for a percentage of each order, depending on the selected plan. Because this app will need to subscribe to orders webhooks, you’ll need to fill out the Protected customer data access form, also located in the Partners dashboard.

The app’s Home page, powered by the <inline-code>Readme.md<inline-code> file in the project root, has step-by-step instructions for setting up the connection. Check out the following “Under the hood” section for more details on implementation and the billing flow.

Have questions?

Join our developer Discord to chat with the Gadget team and the community!

Interested in learning more about Gadget?

Join leading agencies making the switch to Gadget and experience the difference a full-stack platform can make.