# awesome-pwa [![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome) [![Build Status](https://travis-ci.org/hemanth/awesome-pwa.svg?branch=master)](https://travis-ci.org/hemanth/awesome-pwa)
> Useful resources for creating Progressive Web Apps

*Inspired by the [awesome](https://github.com/sindresorhus/awesome) list thing.*

## What is a Progressive Web App ?

> A Progressive Web App uses modern web capabilities to deliver an app-like user experience. They evolve from pages in browser tabs to immersive, top-level apps, leveraging the web's low friction.

_Source:_ [Google Developers - Progressive Web Apps](https://developers.google.com/web/progressive-web-apps/)

## Table of contents

* [Apps](#apps)
* [Tutorials](#tutorials)
* [Articles](#articles)
* [Videos](#videos)
* [Tools](#tools)
* [Kits](#kits)
* [Courses](#courses)

## Apps

* [A selection of Progressive Web Apps](https://pwa.rocks/)
* [A fresher selection of Progressive Web Apps](https://outweb.io/)
* [AirHorner](https://airhorner.com/)
* [AlarmDJ](https://alarmdj.com)
* [Aliexpress](https://m.aliexpress.com/?tracelog=wwwhome2mobilesitehome)
* [Chrome Developer Summit](https://developers.google.com/)
* [Colosseum](https://naramsim.github.io/Colosseum/)
* [Closerintime](https://closerinti.me)
* [Currency Converter](https://www.currency-x.com)
* [Datememe](https://www.datememe.com)
* [Demo PWA](https://github.com/gokulkrishh/demo-progressive-web-app)
* [Dev.Opera](https://dev.opera.com/)
* [DevSpace](https://app.devspace.io/)
* [Expense Manager](https://demo.vaadin.com/expense-manager/)
* [FF-Platfrom-Status](https://platform-status.mozilla.org)
* [Firefox Platform Status](https://platform-status.mozilla.org/)
* [Flipkart Lite](http://www.flipkart.com) ([eng blog post](https://medium.com/progressive-web-apps/building-flipkart-lite-a-progressive-web-app-2c211e641883), [case study](https://developers.google.com/web/showcase/2016/flipkart))
* [GitHub Explorer](https://github-e.com/)
* [Google I/O](https://events.google.com/io2016/)
* [Housing Go](http://www.housing.com)
* [Meat Scope](https://meatscope.camera/)
* [Medium](https://medium.com/)
* [Memory Game PWA](https://pwa-memory-game.surge.sh/)
* [MoneyTracker](https://moneytracker.cc/)
* [Notella](https://github.com/siddharthkp/notella)
* [Notepad](https://www.amitmerchant.com/notepad/)
* [Paytm Lite](https://paytm.com/)
* [Pokedex](https://www.pokedex.org/)
* [Polymon by Polymer](https://polymon.polymer-project.org)
* [PregBuddy](https://app.pregbuddy.com)
* [Progressive Beer](https://deanhume.github.io/beer/)
* [QR Code Scanner](https://qrcodescan.in/)
* [React HN](https://react-hn.appspot.com)
* [Remember](https://paulhoughton.github.io/remember/)
* [SVGOMG](https://jakearchibald.github.io/svgomg/)
* [Smaller Pictures](https://smaller-pictures.appspot.com)
* [Soundslice](https://www.soundslice.com)
* [SplittyPie](https://splittypie.com)
* [Taskade](https://www.taskade.com)
* [TeamGrid](https://www.teamgridapp.com)
* [Tinder](https://tinder.com/)
* [Topple Trump!](https://toppletrump.com/)
* [trivago](https://www.trivago.com/)
* [Twitter](https://twitter.com)
* [Washington Post](https://www.washingtonpost.com/pwa/)
* [Wave-PD1](https://alexgibson.github.io/wavepad/)
* [WeNeed](https://weneed-1147.appspot.com/)
* [Web Bluetooth (Intel® Edison) demo](https://edison-webbt.appspot.com/)
* [Web NFC enabled shopping cart](https://webnfc-shoppingcart.appspot.com)
* [X Sound](https://korilakkuma.github.io/X-Sound/)
* [abc.xyz](https://abc.xyz)
* [ampproject](https://www.ampproject.org)
* [chromestatus](https://www.chromestatus.com/features)
* [emojoy](https://jakearchibald-gcm.appspot.com/)
* [guitar-tuner](https://aerotwist.com/blog/guitar-tuner/)
* [jsfeatures](https://jsfeatures.in)
* [offline-wikipedia](https://wiki-offline.jakearchibald.com/)
* [sv-ginger](https://sv-ginger.appspot.com/)
* [voice-memos](https://voice-memos.appspot.com/)
* [Resume Nation](https://resume-nation.github.io)

## Tutorials

* [A progressive Web application with Vue JS, Webpack & Material Design [Part 1 / 6]](https://blog.sicara.com/a-progressive-web-application-with-vue-js-webpack-material-design-part-1-c243e2e6e402) by [@charlesBochet](https://twitter.com/charlesBochet) and [@KevinJean17](https://twitter.com/KevinJean17)
* [Codelabs to build PWAs with Polymer 2.0](https://codelabs.developers.google.com/polymer-summit-2016)
* [Getting started with Progressive Web Apps](https://addyosmani.com/blog/getting-started-with-progressive-web-apps/) by [@addyosmani](https://twitter.com/addyosmani)
* [Google Developers - Progressive Web Apps](https://developers.google.com/web/progressive-web-apps)
* [Progressive Web Apps with React.js - 4 part series](https://medium.com/@addyosmani/progressive-web-apps-with-react-js-part-i-introduction-50679aef2b12#.ly1xiybxd) by [@addyosmani](https://twitter.com/addyosmani)
* [Retrofit an Existing Website as a Progressive Web App](https://www.sitepoint.com/retrofit-your-website-as-a-progressive-web-app/)
* [Service Worker Cookbook - Mozilla](https://serviceworke.rs/)
* [SmashingMag’s Service Worker script, fully documented](https://www.smashingmagazine.com/serviceWorker.js)
* [Web Powered SMS Inbox with Service Worker: Push Notifications](https://www.twilio.com/blog/2016/02/web-powered-sms-inbox-with-service-worker-push-notifications.html)


## Articles

* [Introducing Pokedex.org: a progressive webapp for Pokémon fans](http://www.pocketjavascript.com/blog/2015/11/23/introducing-pokedex-org)
* [A Tinder Progressive Web App Performance Case Study](https://medium.com/@addyosmani/a-tinder-progressive-web-app-performance-case-study-78919d98ece0)
* [Progressive web apps have leapfrogged the native install model ... but challenges remain/](http://softwareas.com/progressive-web-apps-have-leapfrogged-the-native-install-model-but-challenges-remain/)
* [What Progressive Web Apps Mean for the Web](http://developer.telerik.com/featured/what-progressive-web-apps-mean-for-the-web/)
* [The web app "discovery problem"](https://remysharp.com/2016/04/11/the-webapp-discovery-problem)
* [Are Progressive Web Apps the Future?](http://developer.telerik.com/featured/are-progressive-web-apps-future/)
* [Service Worker - Revolution of the Web Platform](https://ponyfoo.com/articles/serviceworker-revolution)
* [Service Workers: Dynamic Responsive Images using WebP Images](http://deanhume.com/Home/BlogPost/service-workers--dynamic-responsive-images-using-webp-images/10132/)
* [Is Service Worker ready?](https://jakearchibald.github.io/isserviceworkerready/)
* [Progressive Web Apps: Escaping Tabs Without Losing Our Soul](https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/)
* [Progressive Web App: A New Way to Experience Mobile](http://tech-blog.flipkart.net/2015/11/progressive-web-app/)
* [Support for theme-color in Chrome 39 for Android](https://developers.google.com/web/updates/2014/11/Support-for-theme-color-in-Chrome-39-for-Android)
* [Installable Web Apps with the WebApp Manifest in Chrome for Android](https://developers.google.com/web/updates/2014/11/Support-for-installable-web-apps-with-webapp-manifest-in-chrome-38-for-Android)
* [FLIP your animations](https://aerotwist.com/blog/flip-your-animations/)
* [IndexedDB, WebSQL, LocalStorage – what blocks the DOM?](https://nolanlawson.com/2015/09/29/indexeddb-websql-localstorage-what-blocks-the-dom/)
* [Say Hello to Offline First](http://hood.ie/blog/say-hello-to-offline-first.html)
* [You’re Missing the Point of Server-Side Rendered JavaScript Apps](http://tomdale.net/2015/02/youre-missing-the-point-of-server-side-rendered-javascript-apps/)
* [Swift Migration to Progressive Web App](https://medium.com/engineering-housing/progressing-mobile-web-fac3efb8b454)
* [What, Exactly, Makes Something A Progressive Web App?](https://infrequently.org/2016/09/what-exactly-makes-something-a-progressive-web-app/)
* [PWA Performance](https://speedcurve.com/blog/pwa-performance/)
* [The Building Blocks Of Progressive Web Apps](https://www.smashingmagazine.com/2016/09/the-building-blocks-of-progressive-web-apps/)
* [Integrating Progressive Web Apps deeply into Android](https://blog.chromium.org/2017/02/integrating-progressive-web-apps-deeply.html)
* [Is PWA ready on Chinese browser?](https://ispwaready.toxicjohann.com)
* [How I built a Progressive Beer App](https://deanhume.com/Home/BlogPost/how-i-built-a-progressive-beer-app/10148)

## Videos

* [Progressive Web Apps: the future of Apps](https://dev.opera.com/blog/pwa-taipei/)
* [Progressive web apps and what's next for mobile](https://www.oreilly.com/ideas/progressive-web-apps-and-whats-next-for-mobile?utm_source=twitter&utm_medium=webplatform&utm_campaign=YTknRussell-jj)
* [Interview with Google Software Engineer Alex Russell - O'Reilly Fluent Conference 2016](https://www.youtube.com/watch?v=vMg9sycUnm4&list=PL055Epbe6d5bQubu5EWf_kUNA3ef_qbmL&index=36)
* [Progressive Web Apps (Chrome Dev Summit 2015)](https://www.youtube.com/watch?v=MyQ8mtR9WxI)
* [Building and deploying a Progressive Web App at scale with Flipkart (Chrome Dev Summit 2015)](https://www.youtube.com/watch?v=StdKz32M1RM)
* [Building Progressive Web Apps with Polymer (Chrome Dev Summit 2015)](https://www.youtube.com/watch?v=g7f1Az5fxgU)
* [Progressive Web Apps and What's Next for Mobile](https://www.youtube.com/watch?v=JP5p6t3wNLA)
* [Progressive Web Apps with Alex Russell](https://www.youtube.com/watch?v=x7cfLDFVyHo)
* [Building a Progressive Web App - Aditya Punjani](https://www.youtube.com/watch?v=m2tvYGCdOzs)
* [The Service Worker is Coming - Look Busy (vid)](https://www.youtube.com/watch?v=SmZ9XcTpMS4)
* [The applied science of runtime performance (vid)](https://www.youtube.com/watch?v=RCFQu0hK6bU)
* [Breaking the 1000ms Time to Glass Mobile Barrier  (vid)](https://www.youtube.com/watch?v=Il4swGfTOSM)
* [Search and the mobile content ecosystem - Google I/O 2016](https://www.youtube.com/watch?v=xeGzQhAU2XI)
* [The Mobile Web: State of the Union - Google I/O 2016](https://www.youtube.com/watch?v=0SSI8liELJU)
* [Building the Google I/O Web App: Launching a Progressive Web App on Google.com  - Google I/O 2016](https://www.youtube.com/watch?v=__KvYxcIIm8)
* [Polymer and Progressive Web Apps: Building on the modern web - Google I/O 2016](https://www.youtube.com/watch?v=fFF2Yup2dMM)
* [Great libraries and tools for great Progressive Web Apps - Google I/O 2016](https://www.youtube.com/watch?v=Use459WBeWc)
* [Angular 2 and Progressive Web Apps - Google I/O 2016](https://www.youtube.com/watch?v=vAb-2d1vcg8)
* [Fireside Chat with the Progressive Web Apps Crew - Google I/O 2016](https://www.youtube.com/watch?v=Sy4oH8JZuJQ)
* [Progressive, Performant, Polymer: Pick Three - Google I/O 2016](https://www.youtube.com/watch?v=J4i0xJnQUzU)
* [Progressive Web Apps on Firebase - Google I/O 2016](https://www.youtube.com/watch?v=SobXoh4rb58)
* [Progressive Web Apps across all frameworks - Google I/O 2016](https://www.youtube.com/watch?v=srdKq0DckXQ)
* [Instant Loading: Building offline-first Progressive Web Apps - Google I/O 2016](https://www.youtube.com/watch?v=cmGr0RszHc8)
* [AMP + Progressive Web Apps: Start fast, stay engaged - Google I/O 2016](https://www.youtube.com/watch?v=a5X_Ot-R6lo)
* [V8, modern JavaScript, and beyond - Google I/O 2016](https://www.youtube.com/watch?v=N1swY14jiKc)
* [Service workers at scale with Facebook and Flipkart - Google I/O 2016](https://www.youtube.com/watch?v=fGTUIlEM0m8)
* [Houdini: Demystifying the Future of CSS - Google I/O 2016](https://www.youtube.com/watch?v=sE3ttkP15f8)
* [Who are you, really: Safer and more convenient sign-in on the web - Google I/O 2016](https://www.youtube.com/watch?v=MnvUlGFb3GQ)
* [Fast and resilient web apps: Tools and techniques - Google I/O 2016](https://www.youtube.com/watch?v=aqvz5Oqs238)
* [Building for billions on the web - Google I/O 2016](https://www.youtube.com/watch?v=E6hGubMkNfM)
* [Opening Keynote (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=9Jef9IluQw0&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=1)
* [Summit Report: The Web Developers swarm! (Progressive Web Apps Summit 2016)](https://www.youtube.com/watch?v=y-E-z6XVKGI&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=2)
* [Instant-loading Offline-first (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=qDJAz3IIq18&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=3)
* [Summit Report: Checking in with Paul Lewis and Jake Archibald (Progressive Web Apps Summit 2016)](https://www.youtube.com/watch?v=TVolBgyaiTQ&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=4)
* [Mythbusting HTTPS (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=e6DUrH56g14&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=5)
* [Summit Report: Talking HTTPS with Emily Schechter (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=U638eR0ltUo&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=6)
* [Instant loading with HTTP/2 (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=G62aCRIlONU&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=7)
* [Summit Report: Why's it called a Progressive Web App? (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=yxy1BOC1-q8&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=8)
* [Deep Engagment with Push Notifications (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=Zq-tRtBN3ws&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=9)
* [Summit Report: What do I need to know about HTTP2? (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=w--PU4HO9SM&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=10)
* [UI Elements at 60fps (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=ZqdNgn5Huqk&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=11)
* [Summit Report: Progressive Web Apps for any occassion! (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=oKQpfevHHUY&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=12)
* [Progressive Web Apps in any context (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=8dr_IUGwsO0&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=13)
* [Summit Report: Making Progressive Web Apps accessible, at scale! (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=1qqZIeQNuxE&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=14)
* [Putting the Progressive in Progressive Web Apps (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=zHNYFUhVzgw&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=15)
* [Summit Report: Reach, acquisition and conversion (Progressive Web Apps Summit 2016)](https://www.youtube.com/watch?v=Vou8NruMyWA&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=16)
* [Using Web Components to Build PWAs (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=pBCDdeqzUlY&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=17)
* [Summit Report: Building for billions with Progressive Web Apps (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=kxE4bLSC-xw&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=18)
* [To the Lighthouse (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=LZjQ25NRV-E&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=19)
* [Building for Billions (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=Vmg1ECC2r2Q&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=20)
* [Tools for Success (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=m2Zk5CgVX9I&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=21)
* [The Future of Progressive Web Apps (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=kB4MgJ0AoOw&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=22)
* [Konga (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=GNbVdPi24gg&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=26)
* [Samsung internets progressive web app commitment (Progressive Web App Summit 2016)](https://www.youtube.com/watch?v=4_qhu-4EQGA&list=PLNYkxOF6rcIAWWNR_Q6eLPhsyx6VvYjVb&index=27)
* [Polymer Summit 2016 Youtube Playlist](https://www.youtube.com/watch?list=PLNYkxOF6rcICc687SxHQRuo9TVNOJelSZ&v=VBbejeKHrjg)
* [PWA Training Course 2017 Playlist with Sarah Clark, Google Developers India](https://www.youtube.com/playlist?list=PLlyCyjh2pUe9RHFCJHU0kxpaivUzADPYk)

## Tools

* [`Workbox`](https://github.com/GoogleChrome/workbox): Javascript Library for building progressive web apps
* [`sw-precache`](https://github.com/GoogleChrome/sw-precache): A node module to generate service worker code that will precache specific resources
* [`sw-toolbox`](https://github.com/GoogleChrome/sw-toolbox): A runtime caching library
* [`platinum-sw-register`](https://elements.polymer-project.org/elements/platinum-sw?active=platinum-sw-register): handles service worker registration for Polymer applications
* [`offline-plugin`](https://github.com/NekR/offline-plugin): Offline plugin (ServiceWorker, AppCache) for webpack (http://webpack.github.io/)
* [`serviceworkerware`](https://github.com/fxos-components/serviceworkerware): An Express-like layer on top of ServiceWorkers to provide a way to easily plug functionality
* [`msgr`](https://github.com/sdgluck/msgr): Nifty service worker/client message utility
* [`UpUp`](https://github.com/TalAter/UpUp): Makes sure your users can always access your site's content, even when they're on a plane, in an elevator, or 20,000 leagues under the sea
* [`fetch-sync`](https://github.com/sdgluck/fetch-sync): Proxy Fetch requests through the Background Sync API
* [`FetchManifest`](https://github.com/cvan/fetch-manifest): Fetch a parsed manifest from a manifest or site URL ([online service](https://fetchmanifest.org/))
* [`fetch-manifest-json`](https://github.com/hemanth/fetch-manifest-json): Fetch the `mainfest.json` from an URL.
* [`manifest-json`](https://www.npmjs.com/package/manifest-json): CLI tool for creating `mainfest.json`.
* [`PWAify`](https://github.com/vladikoff/PWAify): CLI tool to convert your PWA into a cross-platform desktop app.
* [`Manifest Generator`](https://brucelawson.github.io/manifest/): This simple page will generate the manifest file for you.
* [`sw-delta`](https://github.com/gmetais/sw-delta): An incremental cache for the web.
* [`DSW`](https://github.com/naschq/dsw): Generate your Service Worker dynamically, webmanifest, rules for requests, redirects, etc.
* [`sw-precache-webpack-plugin`](https://github.com/goldhand/sw-precache-webpack-plugin): SW Precache Webpack Plugin
* [`serviceworker-webpack-plugin`](https://github.com/oliviertassinari/serviceworker-webpack-plugin): Simplifies creation of a service worker to serve your webpack bundles.
* [`serviceworker-rails`](https://github.com/rossta/serviceworker-rails): Plugin to integrate Service Worker with the Rails asset pipeline.

## Kits

* [`Angular Mobile Toolkit`](https://github.com/angular/mobile-toolkit): Tools for building progressive web apps with Angular.
* [`Web Starter Kit`](https://github.com/google/web-starter-kit): A workflow for multi-device websites.
* [`Progressive Web Application skeleton`](https://github.com/PolymerLabs/progressive-webapp-config): A simple set of skeleton files for shipping a Progressive Web App.
* [`pwabuilder`](http://www.pwabuilder.com/): All the tools you need to build and deploy your Progressive Web Apps.

## Courses

* [Getting Started with Progressive Web Apps](https://www.pluralsight.com/courses/web-apps-progressive-getting-started) (paid)
* [Progressive Web App Fundamentals](https://www.pluralsight.com/courses/progressive-web-app-fundamentals) (paid)
* [Intro to Progressive Web Apps](https://in.udacity.com/course/intro-to-progressive-web-apps--ud811) (free)