Integrating this REST API with my UI dashboard?

Option 1:
I am planning to use this site’s API: CLICK HERE

I want to use their API to populate the data for the UI dashboard designed in Webflow. Has anyone done something like this or somewhat familiar with how to accomplish this? THANKS :slight_smile:

Otherwise, I will figure out a way with option 2, which seems nearly impossible lol

Option 2:
I am looking to use Memberstack, and Zapier to populate analytics data in the CMS, and spit that data into the UI dashboard designed in Webflow.

Still trying to figure out a solution here too, but not an expert and so any help is great!

The site that I am working on, isn’t finished being designed, because I am still working out this solution. I am currently using templates as placeholders, till I get this functioning so I don’t waste time. Also, after you create an account (you can use dummy info) and you go to the welcome page, reload the page twice, and you’ll see the dashboard button pop up, so you can see what I am talking about.


Here is my site Read-Only: CLICK HERE

Live Site Link: CLICK HERE

@bruh - are you trying to update the data for these charts via API:

@sam-g Essentially, yes. Whether that is the AgencyAnalytics API or I use dynamic content and somehow update the CMS automatically using Zapier and Memberstack. Obviously those charts are currently images, so that will change.

@bruh - how often do they need to be updated? And are they shown on a per user basis?

@sam-g I would love for it to be real time. But, for now 24 hour updates could work. Yes, it would be per user.

Hi @bruh, try to make it with Vue.js.

Is the only way I have found the way to integrate API’s into the website. Look at this example I made:

https://webflow.com/website/Live-Weather-Widget

@bruh - do you have any experience with Python or Node? I think you’re going to have to create a middleware app that runs on something like AWS or Heroku with a scheduled run that pulls data from AgencyAnalytics and then updates corresponding collection items in Webflow.

@Carlos_Ruiz_Del_Vizo thanks bruh, I’ll take a look. It’d be nice to see the JS along side it. Could I see it?

You are able to clone the project and see all the js involved, is not much to it.

1 Like

@sam-g unfortunately little experience there, but I’m willing to learn (I learn fast :slight_smile:) . Is the app essential for updating the data per user from the CMS?

@Carlos_Ruiz_Del_Vizo oh right… duh haha (also could of inspected it).

The question is… how do I tell the API to update the data per user in their personalized dashboards? :nerd_face:

oh, so ideally you need to assign an ID to each user and pull out the data from the API with that ID on the CMS. Is no simple task!

@Carlos_Ruiz_Del_Vizo so the site currently gives each user it’s own ID already. The tricky part is that second part haha

1 Like

@bruh - to be fair I’m not super familiar with Memberstack, but it looks like you can create member specific pages. Which I think you can just set up as a collection in Webflow that displays dashboard info. Correct?

Is this the data you are going to be using for your dashboards?

If that is the case it looks like you need a campaign id to pull the data (along with start and end dates, but you could get that using a script, like today’s date - 8 days for start date, and today’s date - 1 day for end date or something.

Can one user be related to multiple campaigns? I’m guessing yes, but let me know.

@sam-g I appreciate you looking into this. For real.

So yeah, I would create a collection for the data.

Yes, that is the data for the dashboards. All I really need is the campaign data for now, and then the ability to select which campaign the user wants to see (if they have multiple campaigns).

Right as I a said before, they could have multiple campaigns.

@bruh - so if the campaigns are a separate collection I think you can break this job up into a few pieces:

  • Retrieving campaign data from AgencyAnalytics on a per campaign basis, as long as you have an ID field for your campaign ID in the Webflow collection for each campaign this should be achievable. This is where your middleware app might come into play. You’d basically have to set up a job that pulls the data for each campaign and then updates it in the Webflow collection. Unless this platform has an integration with Zapier (which it doesn’t seem to) or another similar service. This would be relatively simple (simple in terms of middleware apps, but it’s not a task you can do without some back-end dev experience) to do in something like Flask.
    • You’d probably also want to create collection item each time a campaign is created in AgencyAnalytics - you could write your valued like campaign id dynamically this way
    • You can relate your user pages to dashboards via reference fields in Webflow, you can probably create these references dynamically using Zapier, again as long as you have a field that denotes which dashboard is related to which user (I’m not sure how you are planning on doing that, maybe something with the naming convention or something more solid like when the dashboard is created filling in a user id field)
    • Member-specific content can be achieved in Memberstack

In a way these are all related, but I think if you can break it down into smaller tasks it will feel more like something you can accomplish.

Here are some resources on Flask:

1 Like

@sam-g Awesome. You’re right, it feels achievable looking at it like this. I’m going to dive into it and get back to you with what I come up with, hopefully in the next few days.

No matter what, I’m going to get this to work haha

@sam-g so turns out the API they have to offer lacks a lot of the data I am looking for. I am currently just embedding an iframe based on campaign ID for each user-specific page. Until Agency Analytics either updates their API with the required data requests or I find someone who has the time to request the data from the original sources I am just sticking with an iframe.

Thanks for looking into this though! Your idea should work once their API is improved.

I wonder if there has been updates on this topic or should I try to implement same approach above?
Thank you!