Where are we with no code platforms?

2022-10-25

I keep on hearing on statups podcasts that founders should MVP their products with no code tools over the week end to get data points as quickly as possible. Given I haven't really used them, I wanted to run a little experiment: Could I leverage no code platforms to build a mini web app displaying a collection of surf web cams?

DISCLAIMER: If you work at Surfline and what you see here makes you un happy, please reach out. Know that I have read the Terms and Services and proceeded with this article thinking I am not violating them. Happy to take down this post or help you figure out how to secure your cameras.

Objective

Surfline provides surf reports and webcams for various surf spots around the world. Here is Ocean Beach webcams for example. Only members that pay a premium should in theory access the webcams but it turns out that Surfline actually leaves the cam URLs open the public because I could grab the URLs inspecting the source code of the page.

So let's pretend we don't know how to code, how do we build a view of the surfline webcams, filtered by regions, to share to our friends and first customers?

What is an MVP here?

Playing the video

It turns out that a surf cam is just a video stream on m3u8 format. How can we display it without embedding a video player in our web app? There are plenty of online video players. Lucky for us, they support deep query and we can easily build a URL that would bring a user to the player with the right data to stream in context. Here is the example of the North Ocean Beach webcam

Alt

User Interface

People want to search for cameras in their regions. So I figured a good enought MVP would basically be a filterable table that has a link to the webcams for all the spots.

Building the MVP

The interface

Not knowing a lot about No Code solutions out there yet, I have tried the two that seemed the most straightforward:

A google sheet + Retools

I played with it and did some research for 1hr and I couldn't figure out how to make the app public so I dropped that idea.

Airtable

Although I realized the "Interfaces" cannot be shared publicly, I could at least get a public table out really quickly so let's use it for our MVP.

The data

Let's gather the data for the webcams around San Francisco.

Step 1: Get a dump of the surfline pages. For example here we get the san mateo county page full html

1 http https://www.surfline.com/surf-reports-forecasts-cams/united-states/california/san-mateo-county/5392427 > /tmp/dump.html 2

Step 2: Extract all the m3u8 links of the live cameras

1cat /tmp/dump.html | grep -Eo "(http|https)://[a-zA-Z0-9./?=_%:-]*.m3u8" | sort -u 2

We can actually even get the rewind mp4 camera links

1cat /tmp/dump.html | grep -Eo "(http|https)://[a-zA-Z0-9./?=_%:-]*.mp4" | sort -u 2

Step 3 Now that we have a bunch of data already and we can manually fill up the airtable data source:

Alt

Step 4 Building the interface. Pretty straightforward table manipuldation. We can leverage some intermediate columns with formulas like CONCATENATE to build a curated view showing only the relevant columns that form our final MVP available here

Alt

What did I learn from this?

A few takeways from this experiment:

  • There is a learning curve to no code tools
  • There is already a lot of No Code tools. So choosing which one we need is already an endeavor
  • Most of the tools I have seen have communities of experts that can be hired to help with your project. Which seems to go against the goal of empowering anyone to build but also shows they aren't that straightforward to use.
  • I think that to make the most of these tools, one need to understand the mindset of the tool and grab inspiration from the showcases.
  • Honestly I found the Retool interface quite cluttered and difficult to work with. It took me some tutorials to get it.

Alt

  • No Code platforms seems to target processes and worklows automation or CRUD UI.
  • A large area of focus seems to be the integrations of tools together: Gmail, Slack, Trello, etc... which I imagine could really help empowering an Ops team quickly
  • The other common use case seems to be offering some kind of data entry or visualization to make an App-ish experience. But from the little I saw, I find the built in admin interfaces like Django Admin to be more powerful.
  • It requires a mindset change for an engineer. My initial thoughts for an MVP of this product was: "A small front end web static web app, with a CSV data store, everything deployed on AWS" because I wanted an embedded player and some more controlled styling. But then I realized I was actually missing the point of minimum in MVP and realize the importance of challenge what seems "easy" to build versus what's good enough here.

Would you like an email when there is a new blog post?

Subscribe to the newsletter