How to Integrate Retool with HubSpot Marketing Hub

HubSpot's recommended authentication method for server-side integrations is private apps, which provide a scoped access token without requiring OAuth user authentication flows. To create one, log in to HubSpot as a Super Admin and click the Settings gear icon in the top navigation bar. In the Settings left sidebar, navigate to Integrations → Private Apps. Click 'Create a private app' in the top right. On the Basic Info tab, give the app a descriptive name like 'Retool Marketing Dashboard' and an optional description. Switch to the Scopes tab to configure which HubSpot APIs your Retool integration can access. For a full marketing dashboard, add the following scopes by searching for them: 'crm.objects.contacts.read' (to read contact records), 'marketing-email' (to read email campaign data — note: requires Marketing Hub Professional or Enterprise), 'forms' (to read form submissions and form definitions), 'workflows' (to read automation workflow data), 'content' (to read landing pages and blog data). Select read-only scopes wherever possible to minimize risk. Click 'Create app' in the top right. HubSpot displays your access token — copy it immediately. This token does not expire by default (unlike OAuth tokens) but can be rotated manually if compromised. Store the token securely; you will paste it into Retool's resource configuration in the next step.

In Retool, click the Resources tab in the left sidebar and click Add Resource. Select REST API from the resource type list. Name the resource 'HubSpot Marketing API' (distinct from any existing HubSpot CRM native connector you may have). In the Base URL field, enter: https://api.hubapi.com — this is HubSpot's unified API base URL used by all HubSpot APIs. Scroll to the Authentication section and select Bearer Token from the authentication dropdown. In the Bearer Token field, paste the private app access token you copied from HubSpot. Alternatively — and more securely — first add the token to Retool's Configuration Variables (Settings → Configuration Variables → Add Variable) as a secret named HUBSPOT_PRIVATE_TOKEN, then reference it in the Bearer Token field as {{ retoolContext.configVars.HUBSPOT_PRIVATE_TOKEN }}. Scroll to the Headers section and add a default header: set the key to Content-Type and value to application/json. This ensures POST requests send JSON bodies correctly. Click Save Changes. Retool does not automatically test REST API connections, so you will verify the connection in the next step by running a test query. The HubSpot API uses versioned paths — most marketing endpoints are under /marketing/v3/ or /crm/v3/ which you will specify as the path in individual queries, not in the base URL.

Create your first marketing queries to verify the connection and populate the dashboard with campaign data. In a Retool app, open the Code panel and click + to add a new query. Select your HubSpot Marketing API resource. Name the query 'getMarketingEmails'. Set the Method to GET and the Path to /marketing/v3/emails. Add URL parameters: 'limit' set to {{ 50 }}, 'state' set to 'PUBLISHED' to retrieve active campaigns (or remove this filter to see all states including drafts). This endpoint returns a list of marketing emails with their configuration and high-level properties. Run the query and check the Results panel. To get performance statistics for a specific email, create a second query named 'getEmailStats'. Set Method to GET and Path to /marketing/v3/emails/{{ marketingEmailsTable.selectedRow.id }}/statistics/list. This returns individual recipient-level statistics. For aggregate campaign statistics, use the path /marketing/v3/emails/{{ marketingEmailsTable.selectedRow.id }}/statistics/histogram with a URL parameter 'interval' set to 'DAY'. Add a JavaScript transformer to the getMarketingEmails query to extract the most useful properties for display: id, name, subject, state, publishDate, stats.sent, stats.open, stats.click, stats.bounce. Run the query and verify data appears.

1// Transformer: normalize HubSpot marketing email list for display
2const emails = data.results || [];
3return emails.map(email => ({
4  id: email.id,
5  name: email.name || '(Unnamed)',
6  subject: email.subject || '',
7  state: email.state,
8  publish_date: email.publishDate
9    ? new Date(email.publishDate).toLocaleDateString()
10    : 'Not published',
11  sent: email.stats?.counters?.sent || 0,
12  open_rate: email.stats?.ratios?.openRatio
13    ? (email.stats.ratios.openRatio * 100).toFixed(1) + '%'
14    : 'N/A',
15  click_rate: email.stats?.ratios?.clickRatio
16    ? (email.stats.ratios.clickRatio * 100).toFixed(1) + '%'
17    : 'N/A',
18  unsubscribes: email.stats?.counters?.unsubscribed || 0
19}));

Extend the dashboard with form submission and landing page data. Create a query named 'getHubSpotForms'. Set Method to GET and Path to /forms/v2/forms. This returns all forms in your HubSpot account with their configuration. For submissions to a specific form, create a query named 'getFormSubmissions'. Set Method to GET and Path to /form-integrations/v1/submissions/forms/{{ formsTable.selectedRow.guid }}. Add URL parameters: 'limit' set to {{ 50 }} and 'after' for pagination. The submissions endpoint returns an array of submission objects, each with a 'values' array of field-value pairs. Add a JavaScript transformer that flattens the values array into named properties for easy display in a Retool Table. For landing pages, create a query named 'getLandingPages'. Set Method to GET and Path to /cms/v3/pages/landing-pages. Add parameters: 'limit' set to {{ 25 }}, 'state' set to 'PUBLISHED'. This returns published landing pages with their URL, publish date, and performance metadata. To get landing page analytics, use the path /analytics/v2/breakdown/page with parameters specifying the page URL and date range. Drag a Tabs component onto the canvas to organize the dashboard — create tabs for Emails, Forms, Landing Pages, and Workflows. Place the appropriate Table and Chart components in each tab.

1// Transformer: flatten HubSpot form submission values
2const submissions = data.results || [];
3return submissions.map(sub => {
4  const fields = {};
5  (sub.values || []).forEach(field => {
6    fields[field.name] = field.value;
7  });
8  return {
9    submitted_at: new Date(sub.submittedAt).toLocaleString(),
10    email: fields.email || '',
11    firstname: fields.firstname || '',
12    lastname: fields.lastname || '',
13    company: fields.company || '',
14    hs_context_page: sub.pageTitle || '',
15    source_url: sub.pageUrl || ''
16  };
17});

Add workflow monitoring to complete the marketing operations dashboard. Create a query named 'getWorkflows'. Set Method to GET and Path to /automation/v3/workflows. This returns all HubSpot automation workflows with their type, status, and enrollment counts. Filter to active workflows by checking the 'enabled' property in a transformer. For enrollment details on a specific workflow, use Path /automation/v3/workflows/{{ workflowsTable.selectedRow.id }} which includes the workflow's action steps. To build campaign attribution — connecting HubSpot marketing activity to business outcomes — create a companion query using a separate Resource (PostgreSQL database or another CRM) that retrieves revenue records. Use a JavaScript query in Retool to join the datasets: match HubSpot contact emails from form submissions to customer records in your database, then aggregate the revenue associated with each marketing campaign. This cross-Resource joining is one of Retool's most powerful patterns for marketing teams. Create a Chart component showing attributed revenue per email campaign, comparing campaigns by ROI. Add a date range picker at the dashboard top level and bind both the HubSpot queries and the database query to the same date range parameters. For complex marketing attribution logic involving multiple HubSpot APIs, custom revenue attribution models, and scheduled reporting Workflows, RapidDev's team can help architect and build your Retool marketing operations solution.

1// JavaScript query: join HubSpot campaign contacts with internal revenue data
2const campaigns = getMarketingEmails.data || [];
3const revenueByEmail = getRevenueFromDB.data || [];
4
5const revenueMap = {};
6revenueByEmail.forEach(r => { revenueMap[r.email] = r.total_revenue; });
7
8return campaigns.map(campaign => ({
9  campaign_name: campaign.name,
10  sends: campaign.sent,
11  open_rate: campaign.open_rate,
12  click_rate: campaign.click_rate,
13  attributed_revenue: revenueMap[campaign.id] || 0,
14  roi: campaign.sent > 0
15    ? '$' + ((revenueMap[campaign.id] || 0) / campaign.sent).toFixed(2) + ' per send'
16    : 'N/A'
17}));