{"metadata":{"image":[],"title":"","description":""},"api":{"url":"","auth":"required","results":{"codes":[]},"settings":"","params":[]},"next":{"description":"","pages":[]},"title":"Overview","type":"basic","slug":"progressive-web-apps","excerpt":"","body":"Progressive Web Applications take advantage of new technologies to bring the best of mobile sites and native applications to users. They're reliable, fast, and engaging. - [Google Web Fundamentals](https://developers.google.com/web/progressive-web-apps/)\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Demo\"\n}\n[/block]\nVisit [flipkart.com](https://flipkart.com) on your mobile phone (android device at the moment) and then add it to your homescreen. You can use Firefox, Chrome or Opera.\n\nThis progressive web app took advantage of newer functionality available in the browser (hence the name progressive), and now it's able to run from the homescreen, work offline and even receive push notifications.\n\n\n[block:embed]\n{\n  \"html\": \"<iframe class=\\\"embedly-embed\\\" src=\\\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2FRJ1h-GiRh1E%3Ffeature%3Doembed&url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DRJ1h-GiRh1E&image=https%3A%2F%2Fi.ytimg.com%2Fvi%2FRJ1h-GiRh1E%2Fhqdefault.jpg&key=02466f963b9b4bb8845a05b53d3235d7&type=text%2Fhtml&schema=youtube\\\" width=\\\"640\\\" height=\\\"480\\\" scrolling=\\\"no\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\",\n  \"url\": \"https://www.youtube.com/watch?v=RJ1h-GiRh1E\",\n  \"title\": \"Flipkart Lite Progressive Web App Demo (Nov 2015)\",\n  \"favicon\": \"https://s.ytimg.com/yts/img/favicon-vflz7uhzw.ico\",\n  \"image\": \"https://i.ytimg.com/vi/RJ1h-GiRh1E/hqdefault.jpg\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Other examples\"\n}\n[/block]\nYou can browse other progressive web apps at [pwa.rocks](https://pwa.rocks)\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"How can we help you?\"\n}\n[/block]\nThis starter sets up most of the tools that you will need to build a progressive web app.\nHowever you will still have to customize the web app manifest and the service worker code.\nThe documentation will help you with that.\n[block:callout]\n{\n  \"type\": \"success\",\n  \"title\": \"SSL required\",\n  \"body\": \"Progressive web apps require SSL to work\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Further reading\"\n}\n[/block]\nWe recommend the excellent [Google Web Fundamentals](https://developers.google.com/web/fundamentals/getting-started/?hl=en)","updates":[],"order":0,"isReference":false,"hidden":false,"sync_unique":"","link_url":"","link_external":false,"_id":"57ffd85f755a2e1700c2bb1f","parentDoc":null,"category":{"sync":{"isSync":false,"url":""},"pages":[],"title":"Progressive Web App","slug":"progressive-web-app","order":3,"from_sync":false,"reference":false,"_id":"57ffd85f755a2e1700c2bb09","version":"57ffd85f755a2e1700c2bb05","project":"567083021dabd80d00b122ae","__v":0,"createdAt":"2016-07-21T15:23:31.032Z"},"createdAt":"2016-07-21T14:54:50.470Z","__v":0,"version":{"version":"3.4","version_clean":"3.4.0","codename":"","is_stable":true,"is_beta":false,"is_hidden":false,"is_deprecated":false,"categories":["57ffd85f755a2e1700c2bb06","57ffd85f755a2e1700c2bb07","57ffd85f755a2e1700c2bb08","57ffd85f755a2e1700c2bb09","57ffd85f755a2e1700c2bb0a","57ffd85f755a2e1700c2bb0b","57ffd85f755a2e1700c2bb0c","57ffd85f755a2e1700c2bb0d"],"_id":"57ffd85f755a2e1700c2bb05","project":"567083021dabd80d00b122ae","releaseDate":"2016-10-13T18:54:23.018Z","__v":1,"createdAt":"2016-10-13T18:54:23.018Z"},"user":"567082433a32d20d00c45cab","githubsync":"","project":"567083021dabd80d00b122ae"}
Progressive Web Applications take advantage of new technologies to bring the best of mobile sites and native applications to users. They're reliable, fast, and engaging. - [Google Web Fundamentals](https://developers.google.com/web/progressive-web-apps/) [block:api-header] { "type": "basic", "title": "Demo" } [/block] Visit [flipkart.com](https://flipkart.com) on your mobile phone (android device at the moment) and then add it to your homescreen. You can use Firefox, Chrome or Opera. This progressive web app took advantage of newer functionality available in the browser (hence the name progressive), and now it's able to run from the homescreen, work offline and even receive push notifications. [block:embed] { "html": "<iframe class=\"embedly-embed\" src=\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2FRJ1h-GiRh1E%3Ffeature%3Doembed&url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DRJ1h-GiRh1E&image=https%3A%2F%2Fi.ytimg.com%2Fvi%2FRJ1h-GiRh1E%2Fhqdefault.jpg&key=02466f963b9b4bb8845a05b53d3235d7&type=text%2Fhtml&schema=youtube\" width=\"640\" height=\"480\" scrolling=\"no\" frameborder=\"0\" allowfullscreen></iframe>", "url": "https://www.youtube.com/watch?v=RJ1h-GiRh1E", "title": "Flipkart Lite Progressive Web App Demo (Nov 2015)", "favicon": "https://s.ytimg.com/yts/img/favicon-vflz7uhzw.ico", "image": "https://i.ytimg.com/vi/RJ1h-GiRh1E/hqdefault.jpg" } [/block] [block:api-header] { "type": "basic", "title": "Other examples" } [/block] You can browse other progressive web apps at [pwa.rocks](https://pwa.rocks) [block:api-header] { "type": "basic", "title": "How can we help you?" } [/block] This starter sets up most of the tools that you will need to build a progressive web app. However you will still have to customize the web app manifest and the service worker code. The documentation will help you with that. [block:callout] { "type": "success", "title": "SSL required", "body": "Progressive web apps require SSL to work" } [/block] [block:api-header] { "type": "basic", "title": "Further reading" } [/block] We recommend the excellent [Google Web Fundamentals](https://developers.google.com/web/fundamentals/getting-started/?hl=en)