Getting started with Webflow & Progressier in 5 easy steps
1Connect your Webflow domain
Open your Webflow Dashboard and go to the Settings of the app you want to make a PWA. Navigate to Hosting > Custom Domains. There, you'll have to follow Webflow's instructions to connect your domain (if you haven't yet).
Still in your Webflow dashboard, once your domain is connected, scroll to Hosting > Advanced Publishing Options and make sure Use Secure Frame Headers is off (it should be off by default).
3Sign up to Progressier
4Upload a logo
Upload the logo of your app. Progressier takes care of resizing it and creating all necessary assets, including your splash screens, app manifest and service worker.
5Get your install link
Progressier provides you with a link to a unique install page that looks like this: install.page/covid. Share it with your users or customers so they can install your app.
Under the hood
Webflow works a bit differently from most other no-code app builders. The difference with say, Bubble, is that Webflow does not allow you to directly add a service worker to the root of your domain. So with Webflow, instead of directly making your domain installable, we create a wrapper around your app that contains the entire installation and push functionality.
Which PWA features does Webflow support?
Let users install your app on their Android device. It works exactly like a native app.
Your PWA is installable on iOS and iPad OS. It will open in its own standalone window. Progressier shows users custom instructions.
Make your app a standalone desktop app that open in its own window. Your PWA can be installed from Chrome and Edge.
Progressier helps users add your Webflow PWA to their Docks for quick access.
Chrome OS Installation
Enjoy native PWA support for your app on Chrome OS.
A familiar app store installation experience bundled in a single-purpose page for your users.
Original Domain Installation
Due to the limitations of the platform, it's not possible to install your app as PWA from your own domain. Progressier provides an alternative custom domain for installation purposes that looks like elonmusk.installable.app.
Web App Manifest
A web app manifest is a basic browser requirement for PWAs. Progressier outputs it automatically based on your preferences.
A service worker is the mechanism that browsers use to deliver push notifications. It can also intercept network requests and cache resources. With Webflow, it's not possible to add a service worker to your PWA.
Cache Static Resources
With Webflow, it's not possible to cache static resources. No service worker = no caching possible, unfortunately.
Without full server-side control over the resources, it's not usually possible to make a site work offline entirely with a no-code app builder like Webflow.
Send push notifications to up to 1,000,000 users in one go within the Progressier dashboard or via the API.
This functionality lets you notify a particular user programmatically. Unfortunately, this feature is not currently supported by Webflow.
Connect User Data
With Webflow, it's not currently possible to sync your user data (e.g. emails, names or account types). Bubble is the best no-code option for that.
In-App PWA Promotion
Installation of your Webflow PWA must be done from the special install page Progressier provides you at sign up.
In-app alerts displayed when users lose network connectivity. Not available with Webflow.
Push Prompt on Standalone
Progressier asks users to allow notifications right after they've installed your app, which generally results in a higher subscription rate
Install & Push Analytics
See in real-time and track over time how users install your PWA and allow push notifications.
Programmatic PWA Creation
Create new Progressive Web Apps dynamically with our API on different domains or subdirectories.
Google Play & App Store Upload
With Webflow, it's not possible to upload your app to Google Play or the App Store as PWA.
Why choose Webflow and Progressier for your PWA?
Leading no-code builder
Webflow is arguably the leader on the no-code app builder market, having raised more than $120 million at a $4 billion valuation. The flexibility of the tool allows you to create beautifully-designed apps.
Unlike many of its rivals, Webflow allows you to export code. So you could design your app in Webflow and later decide to host it somewhere else. Custom hosting your Webflow-created app will substantially simplify the process of making it a PWA. The main limitation with Webflow when it comes to creating PWAs is that the platform doesn't allow you to add a service worker to the root of your domain, which is an essential browser requirement.
Only solution to create a PWA with Webflow
With Progressier, we overcome this by creating a custom domain that looks like elonmusk.installable.app and a custom install page that looks like install.page/covid. Send a link to your install page to users. When they install your app, they actually install our custom domain. Our custom domain then either embeds or wraps your Webflow app.
Progressier is the best tool for creating PWAs with Webflow (I'm biased though!). The process is quick, and there's nothing for you to manage. Whenever browser vendors add new PWA functionality, we add it to all apps that use Progressier. Progressier also comes with a push service, meaning you'll be able to send push notifications to all your users.
When you shouldn't use Webflow & Progressier
If you need offline
If you're building an app that must work offline perfectly, you probably shouldn't use Webflow. It just isn't the right tool for the job. The Webflow server sets Cache-Control and Access-Control-Allow-Origin headers when serving your app resources. And while that isn't abnormal per se (every server does this), this takes away the flexibility you need server-side to cache every resource using your service worker without running into CORS issues.
If you're building a website
Progressier, and Progressive Web Apps, are really more for web apps, rather than just websites. While you can still technically make a website a PWA, it will be of little value to you or your users. And Progressier isn't a free solution, so it probably won't be worth it.