webdew-logo-new_v2-1
   
webdew-logo-new_v2-1
Close
  • Services
  • Work
  • Resources
    • Knowledge
    • Ebooks
    • Tools
      • Website Audit
      • Website Grader
      • HubSpot ROI
  • Blog
  • About
Let's talk

  • fb-icon-01
  • tw-icon-01
  • insta-icon-01 (1)
  • linkedin-icon-01
  • youtube-icon-01
website-green-icon
Websites
  • Website Designing
  • Website Development
  • Website Migration
  • HubSpot Website
  • WordPress Website
  • Growth-Driven Design
video-blue-icon
Videos
  • 3D Videos
  • 2D Animation
  • Whiteboard Animation
  • Video Ads
  • Explainer Videos
  • Testimonial Videos
  • Onboarding Videos
  • Tutorial Videos
  • Social Media Videos
  • Product Demo Videos
marketing-yellow-icon
Marketing
  • Inbound Marketing
  • Inbound Consulting
  • Marketing Automation
  • Search Engine Optimization
  • Brand Domains
hubspot-red-icon
HubSpot
  • HubSpot Apps
  • HubSpot Themes
  • HubSpot Migration
  • HubSpot Onboarding
  • HubSpot Management
  • HubSpot Development
  • HubSpot Audit
  • Free HubSpot Demo
  • HubSpot Diamond Partner
webdew-logo-new_v2-1
  • Services
  • Work
  • Resources
    • Knowledge
    • Ebooks
    • Tools
      • Website Audit
      • Website Grader
      • HubSpot ROI
  • Blog
  • About
Let's talk

How to use serverless functions in HubSpot: A step-by-step guide

How to use serverless functions in HubSpot: A step-by-step guide-vbh
Tag: HubSpot
Author: Guriqbal Singh
Guriqbal Singh
Quick Links

Subscribe to Our Blog

Never Miss Any Update From Us !

With the change in time, we see a lot of advancement in technologies. Every company creates new technology by keeping the future in mind. One of the futuristic approaches in web development that we are going to discuss today is serverless functions.

Do you ever face issues with the server hosting your site? Well, as your site grows, you'll need to spend more and more time maintaining, managing, or updating your server to make sure that your site runs smoothly. And this, of course, will consume a lot of time and effort as well.

But imagine someone else doing that for you and managing the operational infrastructure of your site? Isn't that nice that you can now focus solely on writing your code? That's where Serverless Functions come into play!

A quick tour to HubSpot CMS: A comprehensive guide

Today, I will walk you through the various aspects of Serverless Functions and how you can easily create Serverless functions on HubSpot CMS.

What are Serverless Functions?

Serverless functions enable you to write server-side code that interacts with HubSpot and third-party services through APIs, thus supporting your website's highly personalized and intelligent components.

Serverless functions are used to execute the backend code by cloud service providers. This service is inbuilt in HubSpot. One of the main perks of using Serverless Functions in HubSpot is that developers do not need to buy any server space for their webpages to execute backend code. 

The all new HubSpot CMS provides all necessary APIs to store data in HubDB, with which Serverless Functions can be used to store data. In HubSpot, serverless functions are executed in node.js (which means we will use node.js to write the backend code).

Well, honestly, I had my fair share of hiccups while creating my first serverless function. That's why I decided to write this article to help all the HubSpot enthusiasts out there. So let's get started.

Why Use Serverless Functions?

  • Serverless Functions make the deployment of new code faster, simpler, and easy to automate.
  • Serverless Functions also significantly decrease the probability of downtime during deployment. 
  • Serverless functions enhance the performance of your application and improve the end-user experience.
  • Going serverless can prove to be really cost-effective since most platforms offer a pay-as-you-go model. So you only pay for what resources you use.
  • Serverless Functions demand less overhead and are thus easier to scale as the business grows.
The go-to guide for the HubSpot salesforce integrations best practices

How to Create Serverless Functions?

We can create and execute serverless code in a few simple steps.

  • Firstly, go to design tools.
go-to-design-tools
  • Click on the file and create a functions folder.
create-functions-folder
  • In this folder, we will create a serverless.json file and congrats.js file. Serverless.json file will store the endpoints, and congrats .js will contain the actual backend code to be executed.

set-up-new-function

demo-functions

  • Serverless.json file will be used to store all the endpoints of serverless functions.

congrats-js-file

  • We will change this default congrats.js code to your simple code to get started.
  • Replace the congrats.js file code with this simple code.
                   exports.main = (context, sendResponse) => {

  // your code will be called when the function is executed

 var functions =  "Congrats! You've just deployed a Serverless Function.";    sendResponse({body: functions, statusCode: 200});  

 };

update-congrats-js

  • Now we will create an HTML template to call our serverless functions in the webpage.

create-new-html-file

html-hubl-file

sample-html-file

  • We will add script code to call the serverless function.

   <script>       

    var requestOptions = {

     'method': 'GET',

     'headers': {

      'Content-Type': 'application/json',

     }

     };

   fetch("your portal url/_hcms/api/endpoint", requestOptions)

   .then(response => response.text())

   .then(result => console.log(result))

   .catch(error => console.log('error', error));

   </script>

  • Copy the above code and replace the "your portal URL" with your actual URL and "endpoint" with "congrats" because we have defined the congrats endpoint in our serverless.json file.

script-code-to-save-serverless-functions

  • You can get your default portal URL by following the below-mentioned steps.

   Go to Settings>Websites>Domain URLs.

   Select Language settings.

   Choose any one default URL of your portal.

get-default-portal-url

  • Your serverless function has been created successfully. You can now check it by hitting the URL in the browser as shown below screenshot or using the sample.html template on the web page.
serverless-function

Time to See the Result

We can also use a sample HTML template on the web page to show the result.

  • Goto Marketing>Websites>Website Pages.

go-to-website-pages

  • Click on create and select the website page option.select-website-page-option
  • Go to “all of your templates” option and then search the sample template that we have to create earlier and select it.
go-to-all-of-your-templates
  • After selecting the template, add the internal page name. It could be any.
create-a-page-1
  • Now go to settings, add the title of the page and select the same URL used in the sample template. After that, click on the publish button.
page-settings
  • Now, open the page.
open-the-page
  • You see the output by clicking ctrl+shift+i together and open the console window of the browser.
check-the-output-in-browser

Watch this video to learn how you can set-up your Serverless Functions in HubSpot.

Points to Keep in Mind

1) Serverless functions are designed to be fast and have a narrow focus. That speed empowers them to be perfect companions to the front-end of websites and applications, supporting a quick call and response. However, HubSpot serverless functions are restricted to:

  • 50 secrets per account
  • 128MB of memory
  • Not more than 100 endpoints per HubSpot account
  • You have to use contentType application/JSON while calling a function.

2) Execution limits

  • Every function has a maximum of 10 seconds of execution time
  • Every account is confined to 600 total execution seconds per minute.

3) This means either of these two scenarios can occur within 1 minute:

  • Up to 60 function executions take 10 seconds each to perform.
  • Up to 6,000 function executions take 100 milliseconds to perform.

Functions that exceed these limits will yield an error. As a result, execution count and time limits will return a 429 response. You can find the execution time of each function in the serverless function logs.

How to choose the right HubSpot partner for your business needs?

Wrapping Up

That's it, folks! Now you know how to create a serverless function in HubSpot. You can also set up a local environment for HubSpot serverless functions.

If you have any queries or are still facing problems in implementing the serverless functions, do get in touch with us.

Editor: Richa Sharma

Design HubSpot website without coding

Related Blogs

How to create deals in HubSpot using serverless functions?-vbh
HubSpot

How to create deals in HubSpot using serverless functions?

How to install npm packages in serverless functions in HubSpot?-vbh
HubSpot

How to install npm packages in HubSpot serverless functions?

How to do local setup of serverless functions [step-by-step guide]-vbh
HubSpot

How to do local setup of serverless functions using HubSpot CLI

review-star

Based on 1000+ Reviews on

footer-dot-logo-img
  • Hubspot_Logo-icon
  • clutch_Logo-icon
  • upwork_Logo-icon
  • designrush_Logo-icon
  • goodfirms_Logo-icon
  • g2_Logo-icon
WE ARE GLOBAL
  • US-flag
  • CA-flag
  • IN-flag
  • GB-flag

Copyright © 2019 - 2021 Webdew, Inc. All Rights Reserved

Copyright © 2019 - 2021 Webdew Labs Inc. All Rights Reserved

Copyright © 2016 - 2021 Webdew Private Limited. All Rights Reserved

Copyright © 2019 - 2021 Webdew, Inc. All Rights Reserved

WE ARE SOCIAL
  • fb-icon-01
  • tw-icon-01
  • insta-icon-01 (1)
  • linkedin-icon-01
  • youtube-icon-01
Terms of Services
Privacy Policy