HubSpot
UI Bakery allows you to easily connect to HubSpot CRM with no need for additional layers like APIs and 3rd-party services.
We will use HTTP API Datasource to connect to Hubspot API.
- API Key (deprecated)
First, we need to obtain an API key to be able to connect to HubSpot. To do that, go to Settings -> API Key, click Show or Generate, and then Copy.
Settings -> API Key -> Copy
- Migrating from API key to a private app
If you notice a message in your Hubspot account about the API keys being replaced by the private apps, you'd need to update your configuration.
- Create HTTP API Datasource
Once you have the key, create an HTTP API Datasource and configure it using the following parameters:
- Headers:
- Authorization: Bearer YOUR_ACCESS_TOKEN
Click Connect Datasource, now your UI Bakery app has access to your HubSpot data.
Once you have the connection between UI Bakery and HubSpot, you can access its data, i.e. load and send it back.
To interact with HubSpot API you'll need to use an HTTP Request action step and configure HTTP parameters based on the HubSpot documentation (for instance, at HubSpot CRM Contacts API page).
- Create a new Action with an HTTP API action step, select the datasource, and configure an API URL:
- Since HubSpot returns an object instead of a collection, transform the data to be able to display inside of a table using the following code:
return {{ data.results }}.map(data => ({ ...data, ...data.properties }));
That's it, now you can display your data and send it back to HubSpot. These additional articles can be useful:
Last modified 2mo ago