Using third-party services in apps
This tutorial demonstrates how to extend your Calcapp buttons beyond basic reports and field resets. Using third-party platforms like Zapier, your apps can trigger actions across thousands of external services whenever users press a button.
What you’ll learn
The video shows how to build an app that automatically adds collected data to a Google Sheets spreadsheet, but the same approach works for many other integrations. You’ll learn how to:
- Set up webhook connections between Calcapp and external services.
- Create automated workflows using Zapier.
- Map app data to spreadsheet columns.
- Test and activate integrations.
Integration possibilities
Through Zapier and similar platforms, your apps can trigger actions across thousands of services. Popular integrations include:
| Category | Services |
|---|---|
| Data storage | Google Sheets, Excel, SmartSheet, SQL databases (MySQL, SQL Server, PostgreSQL, Oracle) |
| Communication | Slack, Gmail, MailChimp, Twilio SMS, X, Facebook |
| Business tools | Salesforce, Trello, Google Calendar, Office 365, Evernote, Shopify, Zoho CRM |
| Content | WordPress, Spotify playlists |
How it works
Calcapp uses webhooks to communicate with external services. While we don’t have direct Zapier integration, Zapier’s webhook functionality works seamlessly with Calcapp. You can also use Microsoft Power Automate and Zoho Flow.
IFTTT cannot process data sent by Calcapp apps.
Video tutorial
We have made some changes to Calcapp since this video was first published, and Zapier has made some changes to its service. As a result, some screens may look slightly different. We will update the video in the future.
The video includes closed captioning explaining each step (but no audio). Detailed instructions for each section follow below.
Setting up the app (00:02)
The video begins by creating a new app from the Break-even analysis template. A button will be added to send the app’s data to a Google Sheets spreadsheet as new rows.
Adding timestamp tracking (00:16)
The video shows adding a hidden field to track when data is submitted. The field is named Date and uses this formula:
The TODAY function returns today’s date in spreadsheet format, providing submission timestamps for your data.
Creating the service button (00:30)
The video demonstrates adding a button that sends field values to Google Sheets. From the button menu, Invoke service (Zapier, etc) is selected.
The server address comes from Zapier, which requires creating a new automation (called a “Zap”) at zapier.com.
Setting up Zapier integration (00:45)
The video shows creating a Zap, which is Zapier’s term for an automation. The goal is to have Calcapp trigger Zapier to add new rows to a Google Sheets spreadsheet.
Since Calcapp isn’t directly supported, the video uses Zapier’s Webhooks functionality:
- Select Webhooks → Catch Hook
- This allows your app to trigger Zapier actions
Connecting the webhook URL (01:12)
The video demonstrates copying Zapier’s generated webhook URL and pasting it into Calcapp Creator as the server address. This URL connects the app to the Zap.
The video then shows previewing the app and sending sample data to Zapier, which establishes the connection and allows Zapier to understand the data structure.
Adding the Google Sheets action (01:51)
Next, Google Sheets is connected to the Zap so that captured app data gets added to a spreadsheet. This is where you could choose different services for other use cases (databases, Slack, etc.).
The video demonstrates creating new rows, though Zapier can also update existing rows. A Google account must be connected to Zapier with appropriate permissions.
Preparing the destination spreadsheet (02:14)
A target spreadsheet must be created for the data. In this example, a spreadsheet named Zapier test is used. The spreadsheet needs one column for each app field whose data you want to capture.
Mapping data to spreadsheet columns (02:35)
Zapier requires the spreadsheet name and target worksheet for the new rows. This information is entered using the provided drop-downs.
Next, the data sent from the app must be mapped to the appropriate spreadsheet columns.
Activating the Zap (03:35)
The final configuration step involves naming and enabling the Zap. Once activated, the integration is ready for testing.
Testing the integration (03:54)
Returning to the app and pressing the button again confirms that data flows directly into the Google Sheets spreadsheet.
One additional step is needed: Google Sheets must be instructed to treat the Date column values as dates. Select the column and choose Format → Number → Date to display dates correctly.
The integration is now complete! You can apply the same approach to connect your apps with any of the thousands of other services supported by Zapier.