How to Distribute Your Progressive Web App (PWA) to Your Customers

How to Distribute Your Progressive Web App (PWA) to Your Customers

Follow these instructions to distribute the PWA version of your app to your customers.

How to Distribute Your Progressive Web App (PWA) to Your Customers

In this article we’ll go over how to distribute the Progressive Web App (PWA) version of your app. PWAs are web apps that are initially accessed through the web, and with PWAs, your users essential "bookmark" your PWA to their device, instead of downloading it from an App Store.

Note: PWAs in general, whichever platform it is that generates them, have limitations on how certain features work. For example, there are limitations on how web views work because it's basically like viewing a website in another website in a browser which is why we recommend that you go with the native version of the app (the version that’s submitted to the app stores). If you would like to learn more about PWA’s limitations, you can do so here.

Keeping in mind that PWAs do have limitations, read on to learn how to distribute the PWA version of your app if you decide to use it.

How to Get Your PWA Out to Your Users

When you build an app, your PWA is being created simultaneously. Pretty cool, right? There are just a few steps you need to follow to get it to your users.

Step 1: Upgrade your account to a paid subscription

Step 2: Create a subdomain (also called a CName) for the custom domain you'd like to use for your PWA and point it to pwa.appdocumentation.com

Technically, you can just use the PWA/HTML5 link that’s automatically generated for you to distribute your app, but most people prefer to set up a custom domain for their PWA.

A custom domain, however, will let your users access and download your app right through your own domain/website through a link such as app.yourdomain.com.

To set up a subdomain (aka CName), you will do that through your domain hosting provider. You'll login and go to your DNS settings where you should be able to add a CName. It will look something like the picture below.

Note: Each hosting provider is a little different, so you might try Googling your provider name with "how to set up a cname".

Step 3:  In the App Dashboard go to the “Domain” page found in the “Progressive Web Apps” tab

Go back to your app's control panel and access your PWA's domain settings.

Step 4: Enter the subdomain you created into the field

Scroll down to the "Custom Domain" section and enter the subdomain you created for your PWA and click Save.

(Optional) Step 5: Fill out your metadata information so that your app is more easily searched by search engines.

META tag is an HTML tag containing information for search engines about a specific app. META tags contain keywords or phrases alerting search engines of an app's content to be included in search results for users requesting related information. You can do this in the META Tags page.

(Optional) Step 6: Upload your SSL certificate

Uploading your SSL will add extra security to your PWA via HTTPS to prevent snooping and to ensure content hasn't been tampered with. To do so, simply follow the instructions at the bottom of the “Domain” page:

If you would like to learn more about the Progressive Web Apps tab, you can do so here.

How Your Users can Download/Save Your App to their Devices

Now that you know how to set up your PWA, lets go over how users will add it to their phones.

Step 1: Have them open their phone’s browser and go to the PWA via your custom domain (or the PWA/HTML5 link generated for you if you haven't created one)

Step 2: Have them tap on this button in the browser

Step 3: Have them select “Add to Home Screen”

Step 4: Have them give it a name (it should automatically use the app icon name that you set up in the App Dashboard) then click “Add"

They can now access your app from their phone’s home screen just like any other app.


    • Related Articles

    • What Is The Progressive Web Apps Tab?

      The Progressive Web Apps Tab is where you can manage your Progressive Web App’s (PWA) settings. Read on to learn how to use this tab! What is the Progressive Web Apps Tab? The Progressive Web Apps Tab is where you can manage your Progressive Web ...
    • What Are Progressive Web Apps (PWAs) and What Are Their Limitations

      In this article we'll go over what PWAs are and what differentiates them from the version of your app found in the app stores. What Are Progressive Web Apps (PWAs) and What Are Their Limitations? What is a Progressive Web App (PWA)? A PWA is a ...
    • How to Get Users to Discover Your App: App Mobile Search Ranking

      Once you’ve launched your app, you'll want to make sure people can find it. Here's some tips on how you can stand out from the crowd. Your app has been designed, launched, and out in the wild. Now all you have to do is wait and watch the downloads ...
    • How To Set Up The Share Settings For Your App

      These settings allow you to make a promo page for your app and use the Share App plugin for your users to share your app with others in-app. What are the Share Settings? The Share Settings allow you to add your app’s Store Listing Links to the iOS ...
    • Getting Started: Restaurant App

      In this article we'll go over some great features that you can use in your Restaurant's app to help enhance your customer's experience Getting Started With My Restaurant App Whether you have a restaurant, fast food chain, or a cafe, a mobile app is ...