CMS Development

dobradovic
Contributor

User subscription/registration to have access to a particular page.

SOLVE

Hi, I'm new to the hubspot. I would need one suggestion and whether it is possible to do that in a HubSpot.

 

I would like to implement a subscription model for specific pages. Means when a user subscribes to be able to access that page.

 

On that page, user would have to choose corses, video material for each course.

 

Can I somehow follow the progress of the user, whether user filled in all the fieds for a certain course or whether user completed video for certain course so he can get certificate?

 

In short, I would like to know which user has completed which course.

 

Thank you for your time 

0 Upvotes
2 Accepted solutions
piersg
Solution
Key Advisor

User subscription/registration to have access to a particular page.

SOLVE

You could set up the basic structure and log in logic of an LMS with Hubspot Memberships as @alyssamwilie mentions in her post. If you want it as a single-page application you could use like Vue and HubDB to create courses in steps and then potentially create custom contact properties to track progress for the courses (e.g. course_x_progress that is either "Not started", "In progess" and "Completed") and use the Contacts API to update them to "Completed" when they click the last "Next step". If it was not a SPA you could do the same when they reach the last page in your course flow.

View solution in original post

tjoyce
Solution
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

User subscription/registration to have access to a particular page.

SOLVE
16 Replies 16
dobradovic
Contributor

User subscription/registration to have access to a particular page.

SOLVE

Thank you everyone for response! This is very useful hints. I will check all of these options that you mention. Big thanks! 

Kevin-C
Recognized Expert | Partner
Recognized Expert | Partner

User subscription/registration to have access to a particular page.

SOLVE
dobradovic
Contributor

User subscription/registration to have access to a particular page.

SOLVE

Tnx for response, will check this option!

0 Upvotes
piersg
Solution
Key Advisor

User subscription/registration to have access to a particular page.

SOLVE

You could set up the basic structure and log in logic of an LMS with Hubspot Memberships as @alyssamwilie mentions in her post. If you want it as a single-page application you could use like Vue and HubDB to create courses in steps and then potentially create custom contact properties to track progress for the courses (e.g. course_x_progress that is either "Not started", "In progess" and "Completed") and use the Contacts API to update them to "Completed" when they click the last "Next step". If it was not a SPA you could do the same when they reach the last page in your course flow.

dobradovic
Contributor

User subscription/registration to have access to a particular page.

SOLVE

@piersg Hey, thanks for response. I will check documentation to see how can I use some of frontend frameworks with HubSpot, also I can use reactJS with HubSpot as I saw in documentation? So for the backend integration Im using HubSpot and HubDB? 

 

 

0 Upvotes
piersg
Key Advisor

User subscription/registration to have access to a particular page.

SOLVE

Hi @dobradovic, yeah you can use React in Hubspot. They have a boilerplate for it here. @tjoyce is the master when it comes to JS frameworks and Hubspot.

dennisedson
HubSpot Product Team
HubSpot Product Team

User subscription/registration to have access to a particular page.

SOLVE

@piersg 

Careful, don't want @tjoyce 's head to inflate too much 😜

tjoyce
Solution
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

User subscription/registration to have access to a particular page.

SOLVE

ron.gif

piersg
Key Advisor

User subscription/registration to have access to a particular page.

SOLVE

Not possible 😉

dobradovic
Contributor

User subscription/registration to have access to a particular page.

SOLVE

This is very helpful, thanks!

 

So when I download and setup my React app with this prepared boilerplate, how do I connect my React app with existing HubSpot project? How can I import it so that can be a landing page with functionality done in React Framework? 🙂 

 

Any advice would be helpful! Tnx @tjoyce 

0 Upvotes
tjoyce
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

User subscription/registration to have access to a particular page.

SOLVE

@dobradovic - I tend to use VUE because it has a bit more modular feeling to it, and if you use the following approach, you can avoid transpiling the javascript locally and pushing through the CLI
Here's a quick approach to get started

Module HTML

{{ require_js("https://cdn.jsdelivr.net/npm/vue@2") }}
{{ require_js("./path-to-my-local-vue-logic.js") }}

<div id="MY_VUE_APP">
  <div>
    <h1>{!! header_text !!}</h1>
  </div>
</div>

 

Create a javascript file

path-to-my-local-vue-logic.js

new Vue({
  delimiters: ['{!!', '!!}'],
  el: '#MY_VUE_APP',
  data: {
    header_text: "Hello World",
  }
});

 

dobradovic
Contributor

User subscription/registration to have access to a particular page.

SOLVE

Hey tnx for anwser!

 

Can you give me hint about database in HubSpot? 

 

How can I use database with Vue.js? I also need regstration of useres before starting "course". So I need database with my registered users, courses that I will display to users, and which user attended to which course, did user completed course and so on. Do I need some backend integraton or all of these needs can be achive with only HubSpot and VueJS? 

 

Thanks! Every advice would be helpful 🙂

 

 

0 Upvotes
tjoyce
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

User subscription/registration to have access to a particular page.

SOLVE

@dobradovic - I, personally would build a middleware in Laravel (because I'm comfortable with it... it could be any server language / framework you choose) And I would use the middleware to handle all of the API calls as well as the user login and management. 

In your middleware, you can also sanitize data from your server as well as the HS api and then expose some rest endpoints that your VUE code can then call and interact with. 

 

You can use axios in vue to interact with your middleware... 

https://codepen.io/bryanlewis/pen/aWvdGz

 

The middleware should be doing all of the heavy lifting... hope this helps

Kevin-C
Recognized Expert | Partner
Recognized Expert | Partner

User subscription/registration to have access to a particular page.

SOLVE

Hey @dobradovic  and thanks @dennisedson 

 

Building a LMS is a rather large task, and building one inside of Hubspot complicates that process even further.

 

But to be brief I would suggest building a stand alone app that uses the different HS APIs to essentially use HS as a headless CMS.

Kevin Cornett - Sr. Solutions Architect @ BridgeRev
dobradovic
Contributor

User subscription/registration to have access to a particular page.

SOLVE

Can you tell me a little bit more about how to connect stand alone app that uses the different HS APIs? This is interesting!

 

 

0 Upvotes
dennisedson
HubSpot Product Team
HubSpot Product Team

User subscription/registration to have access to a particular page.

SOLVE

Hi @dobradovic 

This seems like a big project.  A lot of the answers are going to depend on how comfortable you are at development. 

You could build out a pretty cool vue.js site for this.  Tricky part would be the subscription part.  As @alyssamwilie pointed out to you in this post.  Not to say it isn't doable!  You will just be building a lot of this from scratch

 

@Kevin-C , @piersg , walk me off the edge here if you disagree 😅