HubSpot

UI Bakery allows you to easily connect to HubStop CRM with no need for additional layers like APIs and 3rd-party services.
We will use HTTP API Datasource to connect to Hubspot API.
Configuration
API Key. 
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
Create HTTP API Datasource
Once you have the key, create an HTTP API Datasource and configure it using the following parameters:
Base URL: https://api.hubapi.com/​
Query Params:
hapikey: YOUR_API_KEY
Click Connect Datasource, now your UI Bakery app has access to your HubSpot data.
Usage
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:
1.​Transform or map your data.
2.​Add a Component to display it.

Stripe

Next - Data sources

Connecting local database via ngrok

Last modified 4mo ago

Copy link

Outline

Configuration

Usage