Build PWA application for Android Mobile - google-chrome

I am new in PWA application development. I would like to develop PWA application using Angular 6. Any one please suggest for following questions
1) How can we create PWA application for Android using Angular 6 ?
2) How can i install PWA application android phone (Local Testing) ?
3) What are features will not work in PWA application in Android and IOS comparing to native?
Please suggest !!! Great ! Thanks In Advance

PWA is nothing but a responsive website with a manifest and a service worker, manifest provides the functionality such as an icon, app name, add to home screen options, while service worker provides you a lot of functionality like network calls, notifications etc.
Here are some reference links which you can visit:
https://blog.angulartraining.com/progressive-web-apps-for-angular-6-and-beyond-f7e4b9a2f9fa
https://medium.com/#joseant.ruizsantiago/building-a-pwa-with-angular-6-5735d7308d25
https://developers.google.com/web/fundamentals/web-app-manifest/
https://developers.google.com/web/progressive-web-apps/
https://serviceworke.rs/
https://medium.com/dev-channel/why-progressive-web-apps-vs-native-is-the-wrong-question-to-ask-fb8555addcbb
http://www.learncodeonline.in/blog/list-of-top-advantages-disadvantages-of-progressive-web-apps/
Regarding your question about features of PWA vs Native, please see the answer posted here on stack overflow itself.

I recommend to use pwabuilder https://www.pwabuilder.com/
a project founded by microsoft, community guided.
It does a awesome job for android PWA/TWA
other alternative is bubblewrap

Related

Do PWAs support widgets

I have some temperature and flow rate readings being sent over to firebase from an ESP8266. In my existing website I can view those readings but I was wondering if I could make a PWA and then create a widget on my home screen (Android device) with those readings.
Is this currently feasible with a PWA or will I have to go native?
Unfortunately you cannot create Android Widgets using a PWA today, you'll have to go with pure a Android implementation today. It's something we (the Chrome team) have considered, but haven't started working on.
One idea is to convert PWA to TWA (Trusted Web Activity), which has support for homescreen widgets.
reference: https://firt.dev/pwa-playstore#advantages-over-standard-pwa-installation

Add offline mode to a Flutter Web App - Service Workers/Pwas

I need to transform a Flutter app into a PWA and I'm trying to understand if this is possible without rewriting the code in AngularDart.
I did some research and I found out that first I need my Flutter App to become a Flutter Web App but nothing more.
There is also a StackOverflow question that speaks about this but answers are not complete
How to transform Flutter web app into a PWA?
I found some PWA examples with AngularDart, JS, etc... but nothing about a Flutter PWA.
*On the Flutter for Web homepage they mention PWAs but I didn't understand if it is already a feature or not.
Something to start you off.
Can we use Flutter for PWA (Progressive Web App) ?
https://github.com/flutter/flutter/issues/14868
Google I/O 2019 announced https://flutter.dev/web
Flutter on Web is still in preview, but here's a get started page:
https://flutter.dev/docs/get-started/web
since early 2020, Flutter Web support service worker.
here's the feature on GitHub for your reference.
https://github.com/flutter/flutter/pull/48344

HTML Service - PWA

Sorry for a noob question - as I've just started with web development half a year ago..
I need your help regarding setting my GAS app into a PWA. Is there such a possibility? I struggle to find any really helpful resources on how to create a service workers and manifest files to work correctly. It'd be extremely helpful for me to get trained on the topic.
Thanks.
Having a valid manifest.json will enable your application to add to home screen of Android, iOS - Safari only, Chrome - All desktop OS.
You can use this link to generate manifest.json for your application and keep in the root of your project and link it using index.html like below,
You can use Workbox to generate service worker for your application.
I don't know what your GAS app is but if it is based on HTML/JS/CSS you can try www.pwabuilder.com for this purpose. It will give you the manifest and the service worker to put in your code.
You can also try the Lighthouse extension in Chrome and activate it when you are on your site. It will tell you if you app is PWA compatible and what needs work.

How to create Progressive web app apk/any type of file that can be distributed in a enterprise devices

Understandably, PWAs (Progressive Web Apps) are added to home screen after the user visits the web app in a supported browser and clicks on "Add to Home Screen". This works fine for publicly available PWAs.
Thinking of Enterprise Android applications, which needs to be installed to thousands of devices via some app push tools like Airwatch, its practically not possible to have someone open the browser, put the URL and then add to home screen in all thousands of devices.
Is there any other way to automate this deploy/add icon to home screen of a Progressive Web App, not needing the user to visit the web app in a browser, and clicking on "Add to Home Screen" ?
One option we thought about is wrapping in Cordova, but we're trying to find a solution without such wrapper.
Chrome for Android generates and signs .apk file on the fly using WebPack, when the user clicks on "Add to Home screen" (from menu or install banner) option and if the site has a valid manifest.json and service worker.
Extracting and distributing APK: This .apk can be located and exported to desktop using file explorer tools. For some reason, some of default file explorer tools couldn't locate this .apk file. Once exported, this .apk can be used to distribute in controlled environment..like in enterprise devices, where you can enforce the deceive to have Chrome Browser. If this .apk is installed to devices which don't have Chrome browser, user will get a message saying "Chrome" is required to open this app. Once installed, installed PWA apk can be used.
For distributing PWA apps through Play store, google is streamlining the process. A google engineers repose on building APKs (March-2018), when we reached out to them for our enterprise needs.
"Well done extracting the APK and deploying it, it should give a good experience to end users, but I agree it shouldn't be that complicated to deploy web apps on Android.
We are currently working on a streamlined web apps feature, with which you wouldn't need to manipulate or build APKs. This feature will be available on managed devices using Play to deliver apps"
Alternate options: If you think your user base may not have Chrome or don't want to rely on that dependency, wrapping with Cordova kind of hybrid solution is the only way to build your PWA apps for distribution in app stores. With this option, if the "webpack" in the device has the version 40+, user will get PWA benefits. Otherwise, it will still work as a regular hosted web app.
Update on TWA - Trusted web activity is the official way to pack PWA for Android and its available in Chrome 72 and it also supports private/enterprise web apps as the digital assets validation happens in browser now(it use to happen in cloud, making this solution not possible for private web apps).
You can upload the PWA to Playstore using tools like PWA2APK. Just need to share the play store URL to the users, from which they can download PWA app like normal Android App.
Trusted Web activities are a new way to integrate your web-app content such as your PWA with your Android app using a similar protocol to Chrome Custom Tabs.
Trusted Web activities

Paypal api for hybrid mobile app

I am in big dilemma for last few days while studying paypal API for creating an HTML5 based hybrid app that needs to use paypal api for carrying out some transactions.
What I need is I want to use some Paypal API in HTML5 based mobile app, that will finally get bundled into some native app, say for example .apk files.
The problem is :
I have not found a single link that explains that if the paypal provides any api for hybrid app.
I have read their new buttons, name value api, etc. Will any of these will work in my current application when they get deployed as an .apk for android? The thing that makes me worry is that paypal needs redirectURL, so what it will do incase of single page app?
Any links or references are welcome!
I would highly suggest you try Cordova for your App. It does HTML5 in an app format and works very well.
I don't know that you would want to make API calls but your HTML buttons would definitely work. Paypal also has a plugin that would work as well (Cordova is also called Phonegap).
PhoneGap/Cordova will be my recommendation for any hybrid mobile apps.
PayPal has an official plugin for PhoneGap with Android SDK.
Refer https://github.com/paypal/PayPal-Android-SDK-PhoneGap