ISP ranking website that pulls data dynamically from a Google Sheet

Community resources Show & Tell
1

I made this website recently using Webflow to build the UI https://cheapest-internet.co.nz.

It’s a site that ranks New Zealand ISPs by cheapest to most expensive monthly plans. A little bit of custom code is used to pull some data from Google Sheet then render it onto the page.

The number of rankings in the Google Sheet is variable, so I needed a way to dynamically create the right number of line items to show on the website. This is achieved by creating a “template” line item in the Webflow desinger, then using custom code to clone this item and inject values into it.

In the Webflow designer, the template looks like this:

image
image871×231 12.8 KB

Then once rendered onto the page, it looks like this:

image
image968×740 51.5 KB

This mini project has reinforced my belief that Webflow is way underutilised for MVPs and simple apps. I hacked this together in a few hours, and for quick and dirty proof of concept, Webflow (plus a bit of custom code) can produce amazing results.

2 Likes
2

@jasondark no argument! Webflow is great!

3

Two things come to mind seeing this :
1 - this is a great job, but could this not be done directly in Webflow CMS and sorting by value ?
2 - Internet access in New Zealand is crazy expensive…

4

  1. Yes you’re absolutely right that you could use the Webflow CMS to achieve the same result. This would be easier. But you can only add 50 cms items to a Webflow site without paying for CMS hosting. Plus I did this with a Google Sheet for the fun of it really.

  2. Everything is expensive here. Small population + low competition = high prices. There’s a premium you pay for living on an island at the bottom of the world in the middle of absolutely nowhere…

5
  1. OK, gotcha.
  2. Indeed, but then your island’s beautiful… and you’ve got a decent rugby team too…