• Learn
  • Blog
  • Pricing
  • About
  • Sign in

Using third-party services in apps

Buttons you add to apps can open or send reports and reset fields. What if you’d like buttons to add a row to a Google Sheets spreadsheet, send a message to a Slack channel or create a Salesforce lead instead? With a third-party platform such as Zapier, Calcapp can perform these actions and many more.

Zapier enables you to connect apps you build with Calcapp with any of the thousands of services supported by Zapier. It is a third-party service and advanced usage requires a paid plan.

Here are a number of use cases you can realize through Calcapp and Zapier when a button is pressed in your app:

Technically, Calcapp doesn’t have specific support for Zapier, it simply supports sending a so-called webhook event to any server. Zapier fully supports consuming the data sent through Calcapp, and you should also be able to get Microsoft Flow to work. At this time, the IFTTT service is not able to understand data sent by apps built with Calcapp.

This video tutorial shows you how to build an app which adds a new row with its collected data to a Google Sheets spreadsheet when a button is pressed in the app. The video above includes closed captioning explaining the various steps. A more detailed discussion appears below.

Creating a new app (00:02)

In this video, we create a new app from the Break-even analysis template with a button adding the data to a Google Sheets spreadsheet as a new row.

Adding a hidden date field (00:16)

When data is added to the spreadsheet, it can be useful to know when the data was entered. To achieve that, we add a new hidden field, named Date, associated with the following formula:

TODAY()

The TODAY function returns today’s date as a sequential serial number, which is the format spreadsheets use to represent dates.

Later, we’ll make sure that the value of the Date field is added to the first column of the spreadsheet.

Adding the button communicating with Google Sheets (00:30)

Next, a button is added which sends the values of the fields of the sole panel to Google Sheets. The server address in this instance is determined by the Zapier service, requiring us to go to https://www.zapier.com and create a new so-called Zap.

Creating a new Zap (00:45)

A Zap is a blueprint for a task in Zapier. We want our app created with Calcapp to trigger Zapier to add a new row to a Google Sheets spreadsheet.

You won’t find Calcapp among the “apps” supported by Zapier. Our development team hasn’t built one, simply because Zapier’s built-in Webhooks trigger works really well with Calcapp.

Select Webhooks and then Catch Hook, as we want our app to trigger Zapier.

“Picking off a child key”? (01:05)

Zapier provides the option of “picking off child keys,” meaning that you can instruct Zapier to only react to certain data and ignore other data. We suggest that you instead associate a formula with the Enabled property of your button which determines if the button should be active.

Copy the Zapier server address to Calcapp Creator (01:12)

The custom webhook URL generated by Zapier is the server address which should be pasted into Calcapp Creator. It connects your app to the Zap you have created.

Preview the app and send the sample data to Zapier, thereby demonstrating to Zapier that the connection is working.

Connecting Google Sheets to the Zap (01:51)

Now, it’s time to connect Google Sheets to the Zap, to ensure that the captured data from your app is added to the spreadsheet. If you instead want to realize any of the other scenarios described above (adding data to a database, tweeting, sending Slack messages, etc), this is the point where you can choose a different service.

You don’t need to create a new row, you can also update an existing row. Here, though, we’ll ask Zapier to create a new row for us.

Also, you’ll need to associate a Google account with Zapier and give Zapier permission to access your data. Here, we have already connected an account.

Creating the Google Sheets spreadsheet (02:14)

We’ll need to create the spreadsheet that rows should be added to. (Here, a spreadsheet named Zapier test has already been created.) You need to create one column for every app field whose data you wish to capture.

Selecting the spreadsheet and its columns (02:35)

Zapier needs to know the name of the spreadsheet and what worksheet the rows should be added to. Fill out this information using the provided drop-downs.

Then, you need to associate the data sent from the app with the columns of the spreadsheet.

Naming and enabling your Zap (03:35)

The final step is to name your Zap and enable it. It’s now time to test if the app can send data to your spreadsheet!

Previewing the app (03:54)

Switching back to the app and pressing the button once more, we can see that the data flows directly into the Google Sheets spreadsheet you just created.

You need to instruct Google Sheets to treat the values of the Date column as dates. Select the column and then select Format Number Date to make the dates appear correctly.

That’s all there is to it! Now try combining your app with some of the other services supported by Zapier!