Talk for Newry Digital on the new trend of PWAs and how they can be developed using Ionic.

1. Progressive
Web
Apps with Ionic
@stevanbarry
stevanbarry.com

2. What is a PWA?
load like regular web pages or websites but can
offer the user functionality such as working
offline, push notifications, and device hardware
access traditionally available only to native
mobile applications.

4. Why?
Google (with Microsoft joining in late)
V
Apple
Or its about building ‘an experience that feels seamless and
integrated no matter the platform or device’.

5. Building a PWA with Ionic
Ionic offers most of the files needed to deploy a PWA
Ionic is still free in most part - it's also very stable (version 3)
Uses open standards - opensource SDK released under a permissive MIT license.
Easy to set up via node.js and npm - $ ionic start helloWorld blank

6. npx create-stencil ionic-pwa

7. <link rel="manifest" href="/manifest.webmanifest">
<amp-install-serviceworker
src="sw.js"layout="nodisplay"></amp-install-serviceworker>
Vitals for PWAs

8. {
"name": "HackerWeb",
"short_name": "HackerWeb",
"start_url": ".",
"display": "standalone",
"background_color": "#fff",
"description": "A simply readable Hacker News app.",
"icons": [{
"src": "images/touch/homescreen48.png",
"sizes": "48x48",
"type": "image/png"
}],
"related_applications": [{
"platform": "play",
"url": "https://play.google.com/store/apps/details?id=cheeaun.hackerweb"
}]
}

9. and a service worker

11. https://es.goodbarber.com