Build a Slack App to Create and Apply Stripe Coupons in 4 Steps with Standard Li...

Subscriptions are everywhere –– think Netflix, Blue Apron, Xbox Live, etc.–– and are a great way to capture value from your customers. These days, it’s easier than ever to set up subscriptions thanks to products like Stripe Billing that drastically simplify the process. Though Stripe offers tons of utility, managing subscriptions requires granting access and navigating to secure dashboards, which can be overkill for more common administrative tasks.

In this article, we’ll walk through how to create your own Slack -based Stripe coupon management app using Build on Standard Library . Your app will be able to:

• Create coupon codes for all occasions (new subscribers, promos, etc.)
• Apply coupons to existing subscribers
• Solve world hunger and the energy crisis (just kidding)

Creating a coupon

Thanks, Coupon Bot!

Excited? Let’s get started!

Prerequisites

• 1x Stripe Account
• 1x Slack workspace (we recommend you start with a new “test” workspace –– you can painlessly release your app to an active workspace after testing)

Step 1: Opening the Project Template

We’ll be building this product from an existing template in a GitHub repo. This repo has been configured to automatically create event subscriptions and trigger APIs using Build ! But don’t worry coders, you’ll be able to edit the code, add new handlers to other events, and otherwise customize it to your heart’s content after you deploy.

You can view the code on GitHub here . To get your personal version up and running, click the “ Deploy ” button in the README of the repository. You can also follow this link .

You can’t miss it

You’ll be greeted by a page like this:

The five endpoints in our coupon bot

Our app has five endpoints:

1. events/slack/command/apply-coupon.js , the handler that is triggered by a Slack slash command /apply-coupon . It opens a dialog with the callback id apply-coupon that, as you would expect, allows you to apply coupons to existing subscribers.
2. events/slack/command/create-coupon.js , the handler that is triggered by a slash command /create-coupon . It opens a dialog with the callback id create-coupon that allows you to create new coupons.
3. events/slack/dialog_submission/apply-coupon.js , the handler that gets called when you submit a dialog with callback id apply-coupon . It calls the Stripe API to update the appropriate subscription.
4. events/slack/dialog_submission/create-coupon.js , the handler that gets called when you submit a dialog with callback id create-coupon . It calls the Stripe API to create a coupon with the parameters from the coupon creation dialog.
5. message-menu.js , the endpoint that retrieves coupon and subscription data from Stripe and populates the menus in the dialog. It acts as a data source for the menus within the dialogs.

Scroll down and you’ll see that we need to link Stripe and Slack accounts:

The accounts we need to link

Step 2: Setting Up Stripe

Let’s start with Stripe! Linking your Stripe account is very simple. Just click the Link Resource button in the Stripe row, select Link New Resource in the resulting dialog, and select your Stripe account in the following OAuth popup. Since you’re in testmode, just click Skip this account form to avoid unnecessary setup.

The Stripe OAuth popup

Step 3: Setting Up Slack

Setting up Slack requires a few more steps. For this app, we’ll need to:

1. Create a Slack app
2. Create a Bot User for that app
3. Paste our Authentication Redirect URL
4. Paste our Interactive Components URL
5. Retrieve the credentials for your app and link it to your project’s Identity
6. Register the /create-coupon Slash Command
7. Register the /apply-coupon Slash Command
8. Paste our Message Menu URL to populate the dropdowns in our dialogs

Fortunately, each step only takes a minute! To get started, click the Link Resource button in the Slack row. This will bring up a built-in guide that will walk you through the first five steps:

Screenshots included!

Carefully read through and follow each section of the guide before clicking Next Step , pasting the URLs it supplies into the appropriate places in your Slack app dashboard . After you’ve done this, you’ll need to set up three additional URLs: two slash commands ( /create-coupon and /apply-coupon ) as well as the data source for the dropdowns in the dialogs.

Navigate to your Slack app dashboard , and select the app you just created. Next, select Slash Commands from the left sidebar and press Create New Command .

Creating a new command

Name the command create-coupon . Use https://<your Standard Library username>.events.stdlib.com for the Request URL . Click Save in the bottom right once you’re done, and repeat this process to create a second slash command named apply-coupon .

Almost done! Select Interactive Components in the left sidebar, scroll down, and populate Message Menus with this URL: https://<your Standard Library username>.api.stdlib.com/coupon-bot@dev/message-menu/ .

Note:The trailing slash is important –– don’t forget it!

Setting up the data source for the dropdowns in the dialogs. Don’t forget the trailing slash!

Step 4: Ship It!

We’re ready to go! Now we can click the “ Deploy Project ” button at the button of the page on Build . Once it’s finished, open up the Slack workspace you installed the app in. Try running /create-coupon and creating a coupon from the resulting dialog!

If you have existing infrastructure to handle coupon codes, you can give them directly to your customers. Otherwise, you can use /apply-coupon to apply coupons you create with /create-coupon directly to a subscriber. If you don’t have any existing testmode subscribers, you can create one from your Stripe dashboard by creating a test customer, payment source, product, and finally, subscription.

Applying a coupon

Making More Modifications: It’s Just Code!

Although we didn’t write any code during this tutorial, we imported directly from a GitHub template –– which means we have complete control over all the code that powers our workflow(s) and app. To edit and iterate on the code, select the dev environment from the list in project management screen, scroll down, and click the Edit Code button in front of any of the endpoints.

Click “Edit Code” to open your code in code.stdlib.com

This will open your app’s code in code.stdlib.com , our online code editor. You can also use our command line tools to download and redeploy your app if you’d prefer to work locally.

When You’re Ready: Shipping to Production

Once you’ve deployed and iterated on your app and tested it with your test workspace and testmode Stripe account, switching to use production data is simple. From the project management screen in Build, simply click the Ship Release button. You’ll be prompted to link the live version of your Stripe account and a new Slack workspace, which should be the workspace you actually intend to use the app in. You’ll have to repeat the process of setting up the slash commands and message menu data source as well.

Click “Ship Release”

That’s it! Thank you!

We hope you and your customers enjoy using your new coupon management app! If you have any ideas or improvements, feel free to open up a pull request in the template’s repository .

For additional help see our documentation , or join our Slack workspace by visiting https://docs.stdlib.com/ and clicking Request Slack Community Invitation on the right.

Thanks again! Please follow Standard Library on Twitter, @StdLibHQ , or me personally ( @hacubu ) for product updates! We’ve got a lot more exciting things coming.