Build a Slack “New Customer” Notification App in 7 Minutes with Stripe, Clearbit, Standard Library and Node.js
By: Keith Horwood
Tags: Clearbit, Slack, Nodejs, Stripe, API

New users and customers! They register all the time, and the first piece of internal tooling many companies and projects implement is a new user / customer notification pipeline. After all — we need to know who’s signing up so we can learn as much as possible about our users. Today we’re going to use Build on Standard Library to automatically create a Node.js-powered workflow that:

Upon receiving a Stripe customer.created event…

… retrieves additional information about that customer using Clearbit

… and sends a formatted message to Slack in a #new-customers channel!

Our end result will look something like this!

What we’ll need beforehand…

1x Stripe Account

1x Slack workspace (we recommend starting with a “test” workspace)

1x Clearbit Account

1x Standard Library Account

7x minutes (or 420x seconds!)

Minute 1: Create your Workflow

To start with, we’ll want to open up Build on Standard Library in a new tab, you can access it at https://build.stdlib.com/. If you’re not familiar, Build on Standard Library is similar to workflow-generation products like Zapier — but it automatically generates pure, editable Node.js code for you behind the scenes… giving you complete control of the integration.

You should see a screen like this when you visit the page:

Let’s build our workflow!

You’ll want to select the following Event and APIs…

Event: Stripe → customer.created

Stripe → customer.created API: Clearbit → Retrieve a Person by e-mail address

Clearbit → Retrieve a Person by e-mail address API: Slack → Send a Message from your Bot to a Channel

Set up your workflow like this

Once complete, hit Create Workflow to continue.

Minute 2: Link Your Clearbit Account

Standard Library provides something called Identity Tokens that act as keychains, securely linking and storing credentials to multiple API ecosystems to a single API key. You’ll be asked to link your required Clearbit, Slack and Stripe accounts.

You’ll need to link each account to proceed…

Click Link Resource next to Clearbit to link your Clearbit account. The process is relatively painless.

You’ll be shown a list of Clearbit accounts you’ve previously linked

If you’ve never linked an account before you’ll want to click Link New Resource. It’ll bring up the following screen:

You need to fill in these details

You can retrieve this information from https://dashboard.clearbit.com/api — or follow the instructions provided on this screen. When complete, just hit Finish. Voila! All done. Your screen should look something like this when complete:

Clearbit is linked!

Minute 3: Link Your Slack App and Workspace

NOTE: We recommend using a TEST WORKSPACE (i.e. not your official work one!) while developing this workflow. You can ship to production from your project management page later on.

The next step is to click Link Resource next to Slack, you’ll be shown a familiar screen…

Click Link New Resource if this is your first time…

If this is your first time linking a Slack App, click Link New Resource. You’ll be prompted with this screen:

READ THE MANUAL!

Please note: We are creating a new, custom Slack app through this flow. IT IS VERY IMPORTANT YOU FOLLOW THE INSTRUCTIONS CAREFULLY. In order, you’ll need to complete the following steps:

Step 1: Create a New Slack Application

Step 2: Add a Bot User

Step 3: Setup Authentication Redirect URL

Step 4: Setup Event Subscriptions

Step 5: Setup Interactive Components

Step 6: Retrieve Slack Credentials

If you follow all of these steps carefully and in order, upon making it to the last screen you’ll see a Finish: Link Account button at the end of Step 6. Click the button to proceed:

Click Finish (bottom right) to proceed once you’ve copied the values in

You should see an OAuth popup that looks like this:

Click Install to proceed

You can now click Install to proceed. If this window does not pop up, or appears with strange text, you’ll need to close it and go back through the linking steps to make sure you configured everything properly.

Once linked, you’ll be brought back to your Identity page, and Slack will now be properly linked:

Slack is now linked!

Minute 4: Link Your Stripe Account

Phew! Getting the hang of linking accounts? This one is a breeze, comparatively. Hit Link Resource next to Stripe to bring up a familiar screen…

Link new?

If this is your first time linking a Stripe Account, you’ll want to click Link New Resource… but this time it’s super quick. You’ll get an OAuth popup directly, linking your Stripe account. You may be asked to sign in if you haven’t signed in to Stripe recently.

Sign in if necessary

Now, simply click Connect my Stripe Account. Note that if this option isn’t available, you can click an option at the top that says Skip this screen while in development mode.

Connect my Stripe account!

NOTE: You’ll notice this is being connected IN DEVELOPMENT MODE — that’s good! It means we won’t be processing production events yet. We can ship to production later on where we’ll be able to link our live Stripe account.

Once linked, you’ll be brought back to the Identity management page once again. This time, the Next button will be available.

You can now click Next

Click Next to continue to the next step.

Minute 5: Prototype Workflow with the Visual Editor

We can now prototype our workflow! We should be looking at a screen that looks like this:

Prototype Your Workflow

The first thing we’ll do is fill out the email field here with ${customer.email} as the value:

Use this value to read the customer.email property from the Stripe event

Next, click the Slack → Send a Message from your Bot to a Channel API by clicking the six dots to the left of it.

Select the Slack API

Fill out the parameters as follows:

channel : #new-customers

: text: ${JSON.stringify(workflow.enrichment, null, 2)}

Fill out slack.channels.messages.create() details…

Now scroll down to the bottom of the workflow prototyping screen and find the Run with Test Event button. Click it.

Click Run with Test Event…

You should get a result that looks like this:

Ran successfully!

And a message in your Slack #new-customers channel that looks like this…

Awesome! We know this is working now, so let’s spruce it up!

Minute 6: Customize Your Workflow with Code

Great! Now we can start digging in to some Node.js code with Standard Library’s automatic code generation. Let’s scroll back up to the top of the workflow editor, you’re looking for a switch called Developer Mode…

Find Developer Mode (bottom right)

Click Developer Mode to ON. After doing so, your form-based UI editor should now look like a code editor:

You can now see the code that powers your workflow.

From here, you’ll want to copy and paste the following code into the white area (editable area) of the code editor:

Copy and paste this into the workflow code editor

Now scroll down and hit Run with Test Event again…

Hit Run with Test Event…

And you should see a success message…

Congrats! It works.

In addition, your Slack #new-customers channel should now have some fancier data!

Wow!

You can modify which e-mail you want to check by clicking the Grey Cog to the left of Run with Test Event…

Click this Cog to edit test data…

And modify the {"customer": {"email": "..."}} field:

Modify customer.email from user@example.com

For example, you can try the great @patio11…

You can test with different e-mails!

From here, once run successfully, the blue Next button should be available.

Click Next to proceed

You can click Next to proceed. Please note: the Next option will only be available if you have Run with Test Event successfully and haven’t made any modifications.

Minute 7: Ship it!

We’re almost done! From here, all that’s left to do is hit Ship it! Your project will have an auto-generated name suggested for it, and your workflow code will automatically be given a filename to be saved as.

Automatically suggested name and filename

Upon clicking Ship it! you’ll be able to watch your deployment process. This should take under 15s.

Woo!

You can now click View Project to be taken to your project management screen.

Manage your Project

From here you can Fork Environment, Ship to Production and more! Please read our documentation on managing environments to learn about shipping to production and more.

If you click dev (click to manage) you can see a summary of the dev environment you just shipped, with a breakdown of your workflow:

Summary of your Workflow / Endpoint

That’s it! Feel free to play around, run a test event, modify your code (click Edit Code) and more!

That’s it! 🙏 Thank you!

Seven minutes is all it took to build a great, useful addition to your new product, project or company. You can now keep track of all new customers extremely easily. For more information on managing projects and environments, please read our documentation. If you’d like additional help, you can join our Slack workspace by visiting https://docs.stdlib.com/ and clicking Request Slack Community Invitation on the right.

Request an Invitation on the right of our documentation!

Thanks again. Please feel free to follow Standard Library on Twitter, @StdLibHQ, for product and platform updates! Stay tuned for more.