PWA Setup?

[NewMedia]

I am going to hit this question about building a PWA one more time.

I see hundreds of tutorials on building a PWA with a myriad of platforms.
I signed on to a Wappler Pro subscription hoping to using it as a PWA builder first. In the meantime I’ve built PHP applications that work fine to enable hundreds of users in Germany and Austria to file reports that save their data to mysql tables.

But in 2023 I see nothing, literally, despite Google searches and Wappler forum searches, of a Wappler tutorial, or series of docs that specifically illustrates how to start building a PWA that is NOT intended for Android or Apple –

I cannot find one dedicated procedural to start building a PWA that I do not intend to be ported to Android or Apple. I want it to be an installable app that will write and read to whatever mysql or postgresql server I have already set up and which can be accessed as an API service using Wappler Connect.

So far I understand that the database api cannot be included in the same project folder as the front end web app. Fine.

However, the last specific set of Mobile App instructions from January 2022 specify picking the SDK for Android or Apple as the necessity to continue development.

Is there not a reason to dedicate one Start-from-Scratch “generic” Wappler Tools Progressive Web App tutorial now in 2023?

[Teodor]

If you are asking “Can i build a PWA out of the box, using Wappler, with clicking around the UI?” then the answer is no.
But you can look at some posts from @ben who created a few tutorials about building PWAs using Wappler and some custom code.

[HeikoK]

@NewMedia

I want it to be an installable app that will write and read to whatever mysql or postgresql server I have already set up and which can be accessed as an API service using Wappler Connect.

To be precise here: a PWA is a downloadable web site which adds a bookmark icon to the users mobile, it’s not an installable app (which implies appy features like notifications, hardware access and such)

Just create some assests (launch screens for different decvices), add a manifest and service worker to your project and you’re good to go, a quick and handy tutorial:

Convert any website into a PWA in just 3 simple steps

The hardest part is to explain to the user where the “add to homescreen” function is: this actually downloads the assets and initiates the caching, most of the users have no idea (out of my experience).

I use a small popup message on the bottom, telling the user what to do:

iOS, Android

(…and use a cookie to prevent this messages to be displayed to often )

/heiko

[Heather_Mann]

FWIW, I have a PHP/MySQL PWA and have not separated the database from the front end. The instructions that @HeikoK posted are exactly what I did to get mine working and it works perfectly.

[ben]

This may help