How to add custom data sources to the report editor
Visual report editor has a set of built-in app connectors to visualize data from links, like Github and etc. Sometimes you may want to visualize data from your custom data sources and apps. You can connect custom data sources to the report editor. Here is the example for Airtable.
Create app connector
It is required to have some software development skills to implement app connector. The HTTP protocol is going to be used for communicating with Vizydrop. You can choose any language and platform.In this example Node.js is used. The guide related to building app connectors can be found in a visual reports guide of your Targetprocess instance, e.g.:
We have to implement several routes to build a very simple connector to Airtable.
1. Implement GET route available at "/". It should contain app meta with its name, authentication and available sources.
2. Provide app logo by implementing "/logo" GET route.
3. Implement validation of user credential by adding "/validate" POST route to your server. Airtable API key can be validated only on retrieving data, so I do nothing on validation and return the name of Airtable account obfuscated with * to keep it secure.
4. Implement route responsible for retrieving the data which should be available at "/" via POST method.
Explore the source code of app connector to Airtable at our public repository: https://github.com/vizydrop/airtable
As you may have noticed, the custom connector supports one source called "Table" and one API key authentication way to connect to Airtable API. Source has two parameters: Airtable Base Id and Table name (both required by default)
Make connector's HTTP server up and running
Your app should be deployed and reachable via a permanent address. Use Heroku, Amazon, Google Cloud or any other platforms. In this example we use codesandbox.io for testing the connector. The Airtable app is up and running at https://1v7l2ook67.sse.codesandbox.io (please do not use it for production reports).
Add a connector to apps gallery in Vizydrop
Now we need to let Vizydrop know about our awesome connector.
Here are the steps:
1. Click "Create Report"
2. Click "Add custom connector"
3. Provide HTTP(s) URL to your connector into the form and save it
Visualize your data
Create an account for Airtable by providing an API key, configure Airtable source and you are ready for visualizing your data. We visualize flowers uploaded to Airtable at https://airtable.com/shr9M0RMTXK1CMWNy.
a sales representative
Get a live
Let one of our product specialists create your account
and shape Targetprocess for your company needs.