Handoff Design System

Hubspot Deployment

Handoff's integration with hubspot

Deploying to Hubspot with Handoff

Handoff can deploy your site or content directly to Hubspot by using the handoff-hubspot npm library in combination with GitHub CI/CD workflows. This setup automates pushing your latest site changes to Hubspot and can be integrated into your project's deployment pipeline for reliable and repeatable results.

1. Install handoff-hubspot

Add the library to your project with:

Shell
1npm install --save-dev handoff-hubspot

2. Configure Hubspot Access

Obtain a Hubspot Private App Access Token and store it securely in your GitHub repository's secrets (Settings > Secrets and variables > Actions). For example, name it HUBSPOT_ACCESS_TOKEN.

3. Setup a GitHub Workflow

Create (or edit) a workflow under .github/workflows/deploy.yml to deploy to Hubspot on push to your main branch. Example workflow:

YAML
1name: Deploy to Hubspot 2 3on: 4 push: 5 branches: [main] 6 7jobs: 8 deploy: 9 runs-on: ubuntu-latest 10 steps: 11 - name: Checkout code 12 uses: actions/checkout@v4 13 14 - name: Install dependencies 15 run: npm ci 16 17 - name: Build site 18 run: npm run build # (customize as needed for your project) 19 20 - name: Deploy to Hubspot 21 run: | 22 npx handoff-hubspot publish ./dist --accessToken="${{ secrets.HUBSPOT_ACCESS_TOKEN }}"
  • Replace ./dist with the path to your site's build output.
  • The handoff-hubspot publish command pushes your site/assets to Hubspot according to the upload method (static files, CMS pages, etc.) supported by the package.

4. Customizing Deployments

The handoff-hubspot CLI and API support additional configuration, such as specifying target Hubspot portal, folder paths, overwrite strategies, etc. Consult the handoff-hubspot docs for more advanced usage.

By integrating handoff-hubspot with your GitHub actions workflow, you enable automated and repeatable deployments to Hubspot, streamlining the delivery process for your site or apps.