Skip to main content

Hubspot x Stark Connector

This document covers the most recent version of the stark connector and it's core functionality. This document is intended to be used by developers who need to fix a bug or update / add on to the app.

ENV Config ​

env file must be placed in the web folder

SCOPES=write_products,read_customers,write_customers,unauthenticated_read_customers,unauthenticated_write_customers
SHOPIFY_API_KEY="KEY"
SHOPIFY_API_SECRET="SECRET"
POSTGRES="LOGIN URL"
DATABASE_URL="DB URL"
PORT=3000
HOST=YOUR MYSHOPIFY LINK
HUBSPOT_ID='Client id'
HUBSPOT_SECRET='CLIENT SECRET'
HUBSPOT_SCOPES='crm.objects.contacts.read crm.objects.contacts.write crm.objects.companies.read crm.objects.companies.write crm.objects.deals.read crm.objects.deals.write'

To get Hubspot Data:

To get Shopify data:

POSTGRES

  • Your login URL for Postgres DB

DATABASEURL

  • Your database connection URL

Shopify.app.toml ​

# This file stores configurations for your Shopify app. 
scopes = "write_products,read_customers,write_customers,unauthenticated_read_customers,unauthenticated_write_customers"

Databases Needed ​

Connected Hubspot Clients ​

NOTE: user_id is unqiue-- 

-- This script only contains the table creation statements and does not fully represent the table in the database. It's still missing: indices, triggers. Do not use it as a backup.

-- Sequence and defined type
CREATE SEQUENCE IF NOT EXISTS connected_hubspot_clients_id_seq;

-- Table Definition
CREATE TABLE "public"."connected_hubspot_clients" (
    "id" int4 NOT NULL DEFAULT nextval('connected_hubspot_clients_id_seq'::regclass),
    "hubspot_access_token" text NOT NULL DEFAULT ''::text,
    "refresh_token" text NOT NULL,
    "user_id" text NOT NULL,
    "expires_at" timestamp,
    PRIMARY KEY ("id")
);

Hubspot to Shopify Contacts ​

-- This script only contains the table creation statements and does not fully represent the table in the database. It's still missing: indices, triggers. Do not use it as a backup.

-- Sequence and defined type
CREATE SEQUENCE IF NOT EXISTS hubspot_to_shopify_contacts_id_seq;

-- Table Definition
CREATE TABLE "public"."hubspot_to_shopify_companies" (
    "id" int4 DEFAULT nextval('hubspot_to_shopify_contacts_id_seq'::regclass),
    "hubspot_id" int8,
    "linked_shopify_id" int8,
    "deleted" bool
);

Hubspot To Shopify Companies​

/-- This script only contains the table creation statements and does not fully represent the table in the database. It's still missing: indices, triggers. Do not use it as a backup.

-- Sequence and defined type
CREATE SEQUENCE IF NOT EXISTS hubspot_to_shopify_contacts_id_seq;

-- Table Definition
CREATE TABLE "public"."hubspot_to_shopify_companies" (
    "id" int4 DEFAULT nextval('hubspot_to_shopify_contacts_id_seq'::regclass),
    "hubspot_id" int8,
    "linked_shopify_id" int8,
    "deleted" bool
);

Webhook Configuration​

Visit The link below to configure the new webhook
https://app.hubspot.com/developer/23595854/application/1663389/webhooks

Configure the Webhook:​

  • turn off all of the current Webhooks
  • Change the Target url to the new url you want to send events to
  • Save changes
  • Reenable all webhooks

Developer Enviornment Webhook:​

  • Webhook must be https://
  • Used ngrok tool to generate a link for the Webhook in dev environment. See below:
ngrok http {PORT}

Frontend​

Below are a list of changes that were made to the frontend react app.

  • Added Account Connect Comp From Polaris
  • Modified component to match Stark details
  • Added the loading component from Polaris
  • Added logic to handle app state. When the app is online and we are not connected, button will show connect. When we are connected, button will show connected.
  • When not connected, added fetch flow that handles connecting our app to Hubspot
  • When connected, added fetch flow that handles disconnecting the app from Hubspot
  • If the app is not connected, a refresh token from Hubspot will not be supplied and Webhook calls will not be authorized

Endpoints​

/api/install/hubspot
  • Called when connect button is clicked on frontend
  • Starts Oauth process for Hubspot
/api/oauth-callback/:code
  • After the Hubspot work is done, we are redirected back to the app where this process is called
  • Handles adding new user tokens to the database
  • responds with token.message or 'invalid'
/api/check-hubspot-authorization
  • Called anytime the app layer is loaded.
  • Handles validating / refreshing the users authorization tokens
  • responds with responseMessage.status where status is either 'connected' or 'disconnected'
/api/disconnect-hubspot
  • Called when connected button is clicked
  • Handles removing the current user from the connected clients database
  • responds with responseMessage.status where status is 'removed' or responds back with an error object
/api/status
  • Test Endpoint used in Postman to test online state
  • responds with Object.message that states 'Hello From the Server'
/api/hubspot-webhook-processor
  • The endpoint that Hubspot will be told to send events to.
    Handles all enabled events from hubspot. This will include all company / contact major events

Helpers​

companyTemplate.js

  • A template object for create a company in shopify. This allows us to create copies of a parent object and update attributes without having to modify campania's createCompany functionality.

hubspot_configuration

  • System is responsible for handling OAUTH for Hubspot. Any modifications to OAUTH flow will be found in endpoint calls / hubspot_configuration member functions.

hubspot_helpers

  • System is responsible for handling fetch requests to hubspot API. Any Get / Create / Update Hubspot logic should be added to this file.
  • NOTE This version uses oauth v3 for requests so response objects are a bit different that Campania.

shopify_helpers

  • System is responsible for handling all Shopify API Operations. Any GET / CREATE / UPDATE Shopify logic should be added to this file.
  • NOTE Customer create / Customer delete is not a part of library as it is inlined in webhooks system.

webhooks

  • System is responsible for routing all incoming events from Hubspot webhook and processing them. Any webhook processing operations should be added to this system. This includes all Company / Contact Events from Hubspot