Building a PWA with Vanilla Javascript

Getting started with JavaScript & Progressier

1. 

   1Sign up for your trial

   Sign up to Progressier, create a new PWA, choose JavaScript (or your favorite framework) in the dropdown menu, and activate your free trial.

2. 

   2Add the Progressier script to your HTML template

   Copy the code snippet we provide you in the Progressier dashboard and then paste it right before the closing head tag in your HTML template.

3. 

   3Download our service worker file

   Download the service worker we also provide you in the Progressier dashboard and then upload it to the root of your domain.

4. 

   4Install your app

   You'll receive a unique installation page located at a custom URL, like this example: install.page/covid. Open it and install your app, and then subscribe to push notifications.

5. 

   5Send yourself a test notification

   Now all you need to do is send yourself a test notification from the Progressier dashboard (or alternatively our API) to make sure everything works all right. And you're done!

Which PWA features does JavaScript support?

Why choose JavaScript and Progressier for your PWA?

PWA refers to Progressive Web App. Think of a PWA as a native app's sibling, but it's constructed using familiar web development technologies such as HTML, CSS, and JavaScript.

They can be installed on mobile devices like Android and iOS, much like traditional apps. In many ways, they might even outshine native apps since they can also be installed on desktop platforms including Windows, macOS, and Chrome OS.

By opting for Progressier, you're ensuring a top-tier PWA integration for your application. This includes a comprehensive push notification solution and a straightforward method for crafting caching tactics.

Which JavaScript framework excels for PWAs?

A frequent inquiry, but the truth is, the choice isn't paramount. At their core, all frameworks utilize JavaScript. Plus, PWA features employ inherent browser APIs. So, whether you're leaning towards React, Angular, Vue, or even classic Vanilla Javascript, the integration steps remain consistent: incorporating the script into your HTML template and situating the service worker at your domain's root.

However, it's worth noting that certain frameworks, like React, come with an inherent service worker setup. While integrating Progressier into an existing service worker is feasible, it occasionally triggers compatibility snags. Initiating with our provided service worker often simplifies the journey.

On a personal note, I'm an advocate for Vanilla JavaScript. My advice? Resort to a framework only when it's indispensable. Frameworks evolve and fade, but JavaScript remains consistent. A solid grasp of the foundational technology can often lead to more robust and adaptable apps than when relying solely on a framework.

Might a no-code platform be a better choice?

The answer hinges on your app's core functionality. If ensuring offline capability and caching is pivotal, coding is your ally. As of now, no-code platforms fall short in delivering an impeccable offline experience. For intricate apps, traditional coding is advisable. But if speed is your priority, especially for a prototype, no-code platforms like Bubble and Webflow can be excellent contenders.