Channels Stack - Library of YouTube educational channels

Channels Stack

Portrait of the maker

Alexander Olssen

Maker

Maker
Mid level
63
hours to build

Using Webflow and Jetboost to turn your website into a web application

What is it:

Channels Stack - Library of YouTube educational channels

What did I learn:

1. No-code tool feature: Webflow - What advantage do you have using this stack? Is Webflow visually the best front end no-code tool to use? That's a loaded question, but I think the proof is in the pudding so to speak. When you see trends of professionally designed landing pages like Channel Stack by Alexander you can see how using Webflow can be an advantage to use their already built templates to standing up an insanely slick front end in no time. There again is the power of no-code. Obviously you can get professional looking templates with other website builders, but what advantage you get using Webflow is turning your website into a web application.

That being said my recommendation would be that to use Webflow if you have a design/technical background or if you have already used it extensively. There is a medium to high learning curve to use Webflow and it can really bog your momentum down when creating.

If you are just starting out there are tools that you can use to create an application that are easier to learn. The tradeoff is the flexibility in design.

However to create lean, my recommendation is choose the stack that is easier to create first, validate it then decide what are the differentiating features that you need to really make your product standout?

2. No-code tool feature: Alexander uses a Webflow form to capture new Youtube channels and uses Zapier to connect to Google sheets which acts as his database. From their, you can manually update to the Webflow CMS and display dynamically in the UI if you want to proof read the submission. Or if you'd like to display automatically, use Zapier to connect Webflow CMS from Google Sheets.

Setting this up is not a trivial task. I tried to do this and I struggled with Webflow's CMS. I also felt that Webflows learning library was underwhelming and believed that there should be very basic learning resources available to create something like this that a vast majority of the users will need.

3. No-code tool feature: Webflow filters hack - Another advantage to using this stack is dynamic filters. You can see that a common problem is filtering lots of content is overwhelming unless you use categories and some type of filter functionality. You can see on Alexander's landing page how he handles that.

The way he handles it is really smart in limiting the technical work needed to create this by adding Jetboost.io or using Webflow filters.

He actually hacked together a really smart way to make it seem like the filters were dynamically updating the page. Instead what happens is when you click categories for the different videos, a header drops down and exposes a list of different video categories. Then when you click the category it goes to another page on webflow using a subfolder system. Meaning example: channelstack.webflow.io/technology

This is really smart to implement fast. I'd use this if you really prefer to use Webflow as your website of choice, and you don't want to yet integrate with Jetboost.io but want to have some basic layer of filtering to allow for easier discovery.

Other awesome no-code showcases

Icon of showcase

Car Values

Car Values enables free car estimates for used cars.
Typeform
Google Sheets
Zapier
Mailchimp
Import.io
Portrait of the maker
Christopher Drake
Icon of showcase

Dinostar

Habit building app for kids
Adalo
Mailchimp
Dorik
Portrait of the maker
Vijaya Ragavan
Icon of showcase

Project Management

Internal project management for small companies to keep a track of the progress of a project along with milestones and tasks.
Glide App
Google Sheets
WhatsApp
Portrait of the maker
Manan Mehta
Icon of showcase

Wiggle Room

Wiggle Room - securing child care made simple
Bubble
Airtable
Airtable Forms
Portrait of the maker
Jaime-Jin
See 180+ No-code Showcases
See all the showcases