What are PWAs, and how to build them with Bubble?
In my previous article, I discussed the differences between web apps, PWAs, hybrid apps, and native apps. Today, let's dive deeper into PWAs, understand their technical aspects, and how we can build them with Bubble (I will pick up more topics around building PWAs and hybrid-native apps with Bubble in the coming weeks - stay tuned).
Progressive web applications (PWAs) have become increasingly popular over recent years. Unfortunately, much of the information online about them is either superficial or inaccurate, leading to confusion about what PWAs are and what they can do.
While any website (or Bubble app) can be added to a home screen on iOS and Android devices, if an app doesn't have any PWA features, it will simply be a bookmark with an icon - although Bubble even allows us to let it open in full screen. To tap into native features, PWAs leverage two key technical elements: Service Workers and Manifest files.
- A manifest file, on the other hand, provides metadata about the web application, including its name, icon, and startup URL. This information allows the web application to be installed on a user's home screen, providing a more app-like experience. It also allows the app to take advantage of some of the device's native features, like push notifications and offline support.
This technology allows us to build some native features, including natively prompting users to install an app, push messages (Android only, iOS coming soon), offline capability (not recommended for most apps), and background synchronization (Android only). As you can see, iOS is usually more restrictive than Chrome and Android regarding PWA features.
So, how can we build it? There are two options to create such advanced PWA features for our Bubble app: Write a bunch of code (not recommended if you don't know JS very well) or use 3rd party no-code tools like progressier.com, which comes with a Bubble plugin.
If you want to learn more about this, check out my free videos:
That’s it. Keep it simple!