Scaling Business with HubSpot Platform Functionality | HubSpot Developers at INBOUND23

Foreign.

Get started. I just want to apologize to Brian Halligan and Andrew. Coming up next, we're going to kind of up the level here. So yeah, we'll see how it goes. All right, let's get started. All right, let's talk about scaling businesses with HubSpot platform functionality. My name is Dennis Edson. I'm a developer advocate at HubSpot. I am a slowly balding white male and if you want to follow me on Twitter, you can told me if you've never heard of Twitter, I think they call it xno. I post there maybe one or twice per year. Follow me on LinkedIn. That's where you want to find me. And let me introduce to you my friend over here, Hannah.

Thanks, Dennis. My name is Hannah Seligson. My pronouns are she and her. I'm also a developer advocate and I focus mostly on our CRM and our APIs. So to start today's agenda, Dennis and I are going to be introducing a fictional use case of a business that hired us to help them scale their CRM. And through this presentation, we're going to guide you through different CRM CRM functionalities and features that enable them to scale and allow the business to grow with their CRM.

I'm going to just to you this totally not made up company called Three Little Pigs Construction. You probably all have dealt with a company like this. About three years ago, they were all over the place. They were using all kinds of things. They got scared because they didn't know, confused. So they came to HubSpot. They were happy, they learned how to use the platform. But because they have an amazing logo, amazing name, they scaled, they got big. HubSpot out of the box is no longer enough. So, Hannah, what happened?

Well, to kickstart, HubSpot got out of the box. Functionality is essentially when you start your CRM and you have a starter subscription. And essentially what they've shown us is that, hey, we're actually using some of these out of the box functions. So for example, if you're familiar with our standard objects, they're using a contact for their client contacts or their subcontractors or their suppliers, they're also utilizing a company's object. And this has been great. When it comes to clients that they're collaborating with, or once again, they're subcontractors or just folks that they do business with. Oh, no. Well, sorry about that. And then also they were utilizing the deals object. Can we go back?

It's okay. Okay, moving right on.

Sorry about that. They were also Using Pulser, any sort of properties as they grow and any other systems that we might need to utilize. And so when it comes to that object, it was like, okay, well, Dennis is going to get, is going to be using some customization features and can utilize this custom object.

Thank you, Hannah.

Yeah.

Now let's just walk back real quickly. First, we are using just out of the box functionality. Amazing. Great, Hannah. Brilliantly introduce custom objects. But there's a problem and my developer friends out here probably are seeing this already. A lot of manual labor involved. You fill out a form, someone's got to go ahead and bring that in, move it through the pipeline, associate it with things dry. Do not repeat yourself, folks. Yeah, so enter the humble workflow. The workflow itself is an amazing thing because it is automation on steroids. You have an event, it fires something and something happens. That's cool, that's great. You all know about that. I really don't need to explain it. You're not here for that. What I want to say is why I believe workflows might possibly be the most powerful tool in HubSpot just because of custom coded actions. Yeah, go. Yeah, yeah, there we go. Please, please, please. I need it. All right, custom coded action. What does it do? This is a thing that allows you to not only interact with the data inside your HubSpot platform account. No, no, folks, we're going further. We're talking outside. If you got an API out there, if there's a meme generator out there that you want to bring in to your HubSpot portal and see on your contact record, God bless you. Go do it. Custom coded actions are honestly my favorite thing. Moving right on. This is kind of like I'm working on a deal here. I'm using the pipeline, so once a deal goes to close one stage, I'm triggering all kinds of things. You can read through all that. I'm not going to focus on most of it. I'm going to focus on that second one trigger workflow for third party project creation. Now, our friends here, they have subcontractors. Those subcontractors do not need to be in HubSpot. For some odd reason, these subcontractors actually in Asana. And what we need to do, Anna, is once a project is won, we're going to create a project in Asana. That way they do their thing, you do your thing and everyone is happy. Right here, you've probably seen this before, is the common workflow. But that beautiful little thing right there, the custom code that. Right. Sidebar. It's beautiful. We're going to use Node. Node's a great language. You can use Python, but I don't know Python, so I used Node Secrets. Developers out there, please. If anyone has shared their API keys, tell them. Say something. Don't put in a secret. When you're doing a workflow, you can call certain properties within the record, you can pull them in. You don't have to make an API call for that. We do that for you. You're welcome. Next, let's just focus on those secrets. When you run your custom coded action, you're going to use a process environment key or process env and that's going to pull it in. No one's going to see it. Everyone's safe, we're all happy. Same thing going with our properties. You're going to use an event and you're going to see that within that you can pull in your specific properties from that record. Now, first of all, wait, wait, developers. How many developers are here, please? Just out of curiosity. Okay, all right, this is for you. But I tried to make this kind of a fancy slide sequence so everyone can be entertained at least as I go through. All right, everything's going to live within this. All the core stuff. There can be stuff like some functions that happen above it, but most is going to happen right here. The exports I made. Moving on, my, my fancy transitions didn't. I'm sorry, folks. All right, so we're going to pull in all our, our variables in there. Put in there the let is something so I can actually update it and I can't have a constant for that. And you would probably not do that if statement. I'm talking too much about it. I'm going to stop talking about that now. Moving right on. All right, above that, as I said, there's all kinds of functions. You can add all those down there, it's going to call those. It's going to send all that data over there to Asana so they can see it. It's going to pull the Asana ID back. We're going to put that into a property because my friend Hannah over here is going to use that later on in a little secret. And if there's an error, it's going to throw an error. Everyone's happy. Easy peasy lemon squeezy. And just to prove that I actually can code and I do can do this, I went in just a little demo of it. On the right hand side over there, as you can see, is a. Well, that's HubSpot. That's a pipeline. Over there is Asana. I want to push this button. It's hopefully there's a video that happens and you're going to see what. Yes, I'm creating a deal. I did a great job. I sold it and actually it went straight to close one. Thank you. I'm very good salesperson. All right, that happens. That triggered that workflow which triggers the custom coded action. And over here you see a project created and there you go. You now have integrated a third party application. But straw sticks. We need bricks. Hannah, three little things. Take us home.

Thank you. And so while we were able to create a custom object and a custom coded action, it definitely enhanced their CRM. We've given them some automation, we've given them some solution for their data requirements, but still we haven't really solved the issue for centralizing their data. And so this is where extending comes into play. And when I say extending specifically, I mean your CRM, but more specifically your CRM's UI. Right now we have a beta that's going on that we just released and they are UI extensions. And specifically we have a custom card. This custom card has a react front end and has serverless functions on the back end. So essentially our hope is that we can utilize this custom card to centralize that data on a record for Three Little Pigs Construction. Because right now, as I mentioned, they need their operational roles are using their CRM. So they've got like their project managers, they've got their site estimators, and these folks need to be able to access project data that's associated to a company. So let's say a retailer hired Three Little Pigs Construction and they say, oh, we have multiple stores across the nation. Okay, well maybe we need to be able to track all of those projects, all those construction projects for that specific company. So what I was able to do is I created a custom card and this is essentially just for project details, construction project details that applies to a company record. And essentially this card contains key details of a construction project. And I've also incorporated an Asana project that you can open as well. So essentially a custom card, it can be utilized to either display external data or your HubSpot in app data. And you can display this custom card either in that middle pane right there or on the sidebar. And essentially the way that this is built, well, I'll just show you.

Love it.

So this is amazing for developers. You have a local developer environment where you can utilize TypeScript, React and JavaScript to build the custom card. So what I'm doing here is I'm actually using the HubSpot CLI to execute my commands. And what I'm utilizing is I'm actually utilizing a HubSpot project. And you can either import one into your HubSpot app from your GitHub repo, or you can actually create one within the UI. And then what I'm able to do is once I'm building and deploying this, then that's when I'm able to display it in HubSpot. And so what I'm able to do is I can use a private app with an access token to access my HubSpot data into that card. And then with the project, that's essentially what I use to build and deploy. And so we're able to use NPM packages and react components as your front end. So this is the, essentially this is the card that I built and this is this in action. And I'm using a react table to display that data. And then I'm using just serverless functions on the back end. And so you can use, you don't just have to have a table, it's a little boring, but you can actually like display data. You could use images, you could do, you could import just an external service, maybe there are reports that you need. So there's a lot of capabilities that you can use with this. And then as you can see. Access to the Sauna project. Exactly. But then something else that's really important is because this is beta, we want to make sure that developers are able to onboard this easily. So right now what you're looking at, this is just my project. And you can reference the code, you can reference the logs. This is great when you need to reference a bug or an error with your API that you're pulling your data from. And in addition, in app, we provide documentation, we provide sample projects. So we want to make this really easy for you and we want you to be able to leverage this because there's a lot of customization capabilities that you can execute with this. And so, yeah, and it's really helpful too, because if you're a developer and you need to debug, this comes in handy. I don't know. And this is just a highlight of the private app that I use and the different data that you're able to access. So with all of these functions and.

Features, AI is something, but this here is the future.

Exactly. And so with all these functions and features, it's important that you are still executing best practices. And this can be with your APIs, or just in general if you're also integrating with the CRM as well. So something that we want to ensure is that we're just going to give you some tips that we have also collected from our community. Those of you I'm looking at a couple of you and then the reason that's important is because as you're scaling, you are just. There's so much more data, there is so much more complexity. All of a sudden your queries are so much more complex. And also with that comes synchronizing data from other services and that can create delayed response times, indeed, angry end users. So basically to ensure that you have real time data that isn't stale, isn't outdated, and also just to ensure that you're making API requests or data requests efficiently, we just have a few tips. So first, make sure you use a batch API. So if you're familiar, for those of you who aren't developers, we use APIs to basically get our data, we fetch our data, we create, so forth. But there's always a batch endpoint and this can mitigate making multiple API requests. And then in addition, make sure you're also caching your data. This will help with any sort of stale data. You can implement different mechanisms like time to live. Also, you should really utilize the HubSpot search API. It's very underrated and I think we might even have a blog post about that recently.

Yes, we might actually.

Yeah, so, so, and then as far as associations and rate limits, well, first.

Of all, organize your data, folks. If you got data, it's not useful if you can't see what's in there. So organize, use associations. Now you can use association labels. Now you can association object to object. Now you are happy people. Next, just make sure you check your rate limits. If you have followed the very, very useful advice of Hannah here, you probably won't run into this. But rate limits are a thing. Your tokens will have all the information about that you guys know. Do it. Take care of yourselves out there.

Yeah. And for those of you who might not know what a rate limit is, it's just when you are requesting data and you exceed a limit, unfortunately HubSpot we can only offer so much, so you might exceed those rate limits. So it is something to keep tabs on and there are ways that you can monitor it in your HubSpot app. And so now that we've introduced customization capabilities, we've shared some of those out of the box functionalities. And we've also introduced to you ways that you can extend your own UI with some best practices. We're really hoping that we give you, as just a user or a developer, ideas on how you can help a business scale. Because oftentimes with any sort of product, the art of the possible sometimes takes imagination or examples like this. And so we hope that this will give others just ideas about how they can really extend their CRM and how they can utilize some of our features and our other subscription tiers to really get the most out of the system for their business so that everything is running efficiently. So what was the final outcome, Hannah?

I am so glad you asked. Three little pigs. They're happy. They are on hog heaven, as you might say. They are scaling like none other. They're going on. They might hire us again for another project. I don't even know. They're happy people. But hey, more importantly, you've got this. You do got this, Hannah. You do you out there, you can do this. Developers, they raise their hands at one point, find them, talk to them because they are going to make y' all so much more successful.

Really.

Dan, I want to add something. Okay, you're going to get lost. You're getting stumped. You're not going to know. To answer the question, you've got the community. As a matter of fact, these two people I think are actually in the audience and you should meet them. Mike, he did Portal Iq so he knows everything about basically any integration question you might have. Anton, if you got CMS questions, that's your boy. Developer Hug's coming. He's going to be doing that. So stay tuned for that and just community in general. Ask questions. Developer Slack developer forums in general. Thank you for being a great community.

Yes. Yeah, we have so many community resources and so even if you are a user developer, join our Slack channel. Check out our documentation. We have a community forum as well. So if you ever are getting stuck, you're probably not the only one who is. And if something seems complicated, it probably is. So feel free to reach out to us and to just get some clarity and some support. And something I also wanted to note is that everything that we've talked about today, it was kind of like a little bit high level. So if there is something that you want to learn more about, we made sure to include code, snippets, links that are relevant to each feature and function that we shared with you today. You can actually scan that QR code. That'll give you access to our repo where you can access the custom card that I built the custom code action that Dennis built, along with all of the documentation and irrelevant blog posts, especially with custom objects that need to scale. One of our advocates wrote a great blog post about about that and then.

That'S pretty much it.

We're here for questions and feel free to just come up to us.