I currently have an ionic (v5) React app (including capacitor) that is distributed as a hybrid app on the app store and play store.
Now I want to use this app as a web application (browser) on mobile and desktop.
Since my app is written with web technologies, and ionic is cross-platform, I understood this is possible.
My question is if it’s necessary and is it the correct approach to change my app to be also a PWA or can ionic run as a simple web application as well?
Please note:
I do not want to convert my app to be only PWA since ios don’t support push notifications . In addition, I don’t want to lose the app stores traffic
Since PWA has a caching strategy and as I understood is mainly used instead of a hybrid/native app, I’m not sure if it’s the correct approach.
You dont need to convert it into a pwa to be usable on a desktop browser
I see two options - use electron to build a standalone app installable on the machine
Or host the app on a server. The server config needs to be geared towards hosting a SPA which at least means that all route request are to be directed towsrds index.html
Pwa can help also making the app more performant in flaky conditions but comes at additional developer costs gor managing updates
I dont get your point re not wanting to loose app store traffic in relation to pwa. Can you explain?
Thank you for the quick response.
If I were to convert the app to be only a PWA vs a hybrid app as I understood the app could not be published in the iOS app store, therefore I can potentially lose the audience who would install my app from that source of traffic.
Would you be able to provide me with some more info (pr docs) on how to host an ionic app on the server, or is it not ionic specific?
Ok so, PWAs on its own are just web assets that do not comply the app store requirements, as app stores require an ipa binary (or something similar - I have not real experience with app store). That’s basically the hybrid app for which capacitor is a real good solution (or cordova in the past).
Android playstore allows something like Trusted Web Activity - but that is android only. Otherwise you need to create an APK/AAB binary.
If you host as PWA or even as browser only version, you per definition allow users to move to your app outside of the app store. There is no way around that.
Installability on iOS is not a frictionless experience on either PWA or just browser only - the user has to manually add to home screen. The app can function offline though if presented as PWA (providing it has offline features).
Deployment of the app either as PWA or as browser only is indeed not ionic specific. It is a server configuration thing. See link below for some info on the deployment configuration - which isn’t angular speciifc. Once you build your web assets, you need to put them on the server.
If you have an app built in Ionic, you basically get the PWA for free-- you can build a PWA from your codebase in the same way that you build iOS and Android apps.
When you buildyour app, prior to open the native app IDE, all the files needed to hosting the app are created in the www folder. All you need to do is upload those files to a server(note that the server needs to be configured to host a SPA) and you can access it from any supported browser. Of course, you loose some native functionalities if they are present in the app, but you can always alert the user the browser support is limited. Or you can use electron to generate a native desktop application.
Here is the .htaccess I use to configure the host for a SPA
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
# If the requested resource doesn't exist, use index.html
RewriteRule ^ /index.html
Since app stores are important to you you can skip completely the PWA and just host your app as a regular site(as explained above) and have capacitor check if the user is navigating using a mobile browser and give him the option to be redirected to the store to download the app.
But if you also want to configure the app as a PWA you can still do it by creating the service worker and a manifest. But as you mentioned, if you have the same(ish) functionalities but don’t need to install the app why should you install the app in the first place(from the user’s point of view). But this is only a “risk”. Many people still prefer to install the native app. I think most people just don’t care as long as their needs are answered. Sometimes the best option is to have the app as a site and don’t allow users to use it in the browser from their mobile devices, that is, when the app detects it’s running in said browsers redirect to an unsupported page or simply redirect to the app store/play store.