awesome-pwa

Useful resources for creating Progressive Web Apps

Sponsors

MagicBell

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

Table of contents

• App Directories
• Apps
• Tutorials
• Articles
• Videos
• Tools
• Kits
• Courses
• Conferences

App Directories

• appsco.pe
• 0data.app
• paquet.app
• pwalist.app
• store.app

Apps

• 2brew: PWA timer for coffee brewing
• 3D House Editor: Free 3D floor planner
• abc.xyz: Alphabet website
• Air Horner: Air horn sound.
• AlarmDJ: Online alarm clock that plays MP3 files or YouTube videos.
• ampproject: Web component framework.
• Anonynote: Note-taking app.
• Avain.app: Avain
• Backgammon: Backgammon game with local multiplayer (no single player).
• Bangle.io - A Notion like local note taking tool where data is saved in your computer and in Markdown format.
• Bento-starter: Open-Source Full-Stack solution for fast PWA development
• Best Markdown Editor: undefined
• BitMidi: Listen to your favorite MIDI files.
• Booksie: An open catalog of free picture storybooks for children instantly available for reading.
• Brutalist Hacker News: A Hacker News reader inspired by Brutalist Web design, Cyberpunk, retro computing, Y2K Aesthetics
• Budget Tracker: Track expenses and analyse if they stick to a budget
• bundle: A quick and easy way to bundle, minify, and compress (gzip and brotli) your ts, js, jsx and npm projects all online, with the resulting file size.
• Calculator: A calculator app with theme switcher
• Care Cards: Care Cards
• Cat Safe Foods: Sharing food with your cat? Make sure it's safe first
• Chitchatter: Secure peer-to-peer chat that is serverless, decentralized, and ephemeral
• Chrome Developer Summit: Google Developers
• Closerintime: #closerintime
• collAnon: Private discussions, perspectives exchange and a simple Gantt calendar.
• ColorBeta: Advanced CSS Gradient Generator
• Colosseum: Displays Pokemons in a beautiful way
• ComputerBase: German IT news site.
• Contrax: Track your contracts, subscriptions and trials.
• Crazy Dice: Simple Dice App.
• Currency Exchange Loss Calculator: Currency Exchange Loss Calculator
• Datememe: Online dating.
• Demo PWA: Demonstrating offline, push notifications, background sync etc.
• Dev.Opera: Dev.Opera
• DevDocs: API Documentation Browser
• Digikala: Digikala Web App
• Dog Safe Foods: Sharing food with your dog? Make sure it's safe first
• DoHabit: Straightforward habit tracker.
• DontBore: Find and share logins.
• DTH Search India: Search DTH TV channel numbers in India.
• ELFSH: Food and expense manager.
• emberclear: Encrypted Chat. No History. No Logs.
• Emoji Log: Personal tracker
• Etch: A Small team of Designers and Developers.
• Farmhand: A resource management game that puts a farm in your hand
• FarmOS: Farm record keeping
• Fast Golf Scores: Fast Golf Scores.
• FileLove: Minimal p2p file transfer right in the browser.
• FlagWarriors: Minimalist multiplayer strategy game.
• Football Peek: Football results.
• Freelancer: Hire the best freelancers for any job, online.
• ghChat: Chat application for GitHub.
• GitHub Explorer: Profile viewer.
• Google Drive: File storage.
• Google Duo: Video Calling.
• Google Maps: Online maps.
• Google Photos: Photo management.
• GPA Calculator: Generate animated artwork from your unique GPA inputs.
• GPA Calculator: Calculate your college GPA.
• guitar-tuner: Aerotwist Guitar Tuner
• Housing Go: Real estate in India.
• Hyperdraft: Turn your text notes into a website.
• Indecisive.US: App to help you make a decision.
• Journalistic: Micro Journaling App.
• Joybox: A pinboard for audiovisual media.
• jsfeatures: JavaScript features
• JSON Formatter: Minimalist JSON formatter.
• JustInvoice: An intuitive invoice manager that works completely in the browser and offline.
• JustTimeTrack: A Free and Open source Time Tracker.
• Kahla: Business messaging app.
• Kommit: Create flashcards and learn them with spaced-repetition.
• Kudoflix: Online video editor.
• Launchlet: Customize any website with JavaScript or CSS.
• Let's Plant: Plant chooser.
• Life counter: Life counter app for 2 players. Supports game profiles, cout up/down.
• Lofimusic.app: Online radio Radio
• Lorem Ipsum: Lorem Ipsum generator.
• Math Riddles: Interesting Math Riddles.
• Make Better Software: Raise software standards.
• MConverter: Online file converter.
• Medium: Writing space.
• Memory Game PWA: Strengthen your memory.
• MΞRKLIN: Open-source Ethereum Wallet Explorer.
• Messages for web (by google): 400
• MoneyTracker: Personal finances tracking web app.
• Morse Code Translator: Morse Code tools
• MTGStocks: Magic the Gathering price tracker.
• Murlok.io: World of Warcraft Shadowlands.
• Music Player PWA: Music Player.
• MYHELLOIOT: MQTT client application.
• Notella: No fluff notes app.
• OmniCam: Live streaming webcams around the world.
• Othello: Play Othello against the computer.
• PakWheels: Buy/sell cars.
• Passky: Free and open-source Password Manager
• PasteePad: Free and simple notepad app
• Paytm Lite: Online wallet and payments.
• Photopea: Online Photo Editor.
• PixelCraft: Pixel Art Editor
• Player order selector: Random player order selector.
• Pocket Devices: Pocket-sized tools for seamless functionality on the go.
• Pokedex: Indexing Pokémon
• PokeQuest Wiki: Search for Pokémon
• Pomotimer: Pomodoro Technique Timer
• Progressive Beer: Progressive Beer
• PPResume: A LaTeX Based Resume Builder
• PWA-NES: 8-bit NES emulator
• Qi Reader: A modern web RSS reader.
• QR Code Generator: Create custom QR Codes.
• QR Code Scanner: Scan a QR code.
• Regex101: Build, test and debug regex.
• Remember: Location-based reminders.
• RepoTracker: Better GitHub Repository Stats, Charts, and Insights
• Resume Nation: Resume creator.
• Rydeen: Task management app for individuals.
• SaintsApp: New Orleans Saints' game schedule.
• Saucekudasai: An Anime seacrch engine that finds animeinfo based on image provided
• Similar Worlds: Experience Project Alternative. Find people with similar interests.
• Simple Currency Converter: Currency Converter
• Skcript: Ruby on Rails Consulting.
• Smaller Pictures: Image compressor.
• Soodoku: Advanced sudoku game, works online & offline, without ads and distractions.
• SoundCloud: Stream and listen to music.
• Soundslice: Create living sheet music.
• SplittyPie: Easy expense splitting.
• Spotify: Music streaming.
• SvenPanel: The Shrine - The Message Is Feierei Alda.
• SVGOMG: SVGO's Missing GUI
• Swahili Dictionary: Offline Swahili-English-Swahili dictionary
• Taskade: Remote Team Workspace.
• Telegram: Telegram Web App.
• Tender: Personal finance app.
• Themer: Theme generator for editors, terminals, wallpapers, and more.
• Threema Web: The messenger that puts security and privacy first.
• Timetable: Interactive editable timetable.
• Tinder: Dating app.
• Todoly: A Simple ToDo PWA
• Total Formatter: YAML Formatter
• trivago: Hotel prices.
• Tutor Portfolio PWA: ???
• TurboPixel: PixelArt Camera PWA
• Twitter: Microblogging app.
• Uber Web: Ridesharing app.
• Unalengua IPA Translator: Translate to IPA.
• Veganify: Check if a product is vegan or not.
• VeggieTables: Track your crops and farming activities.
• Versus: Consumer electronics shopping.
• VideoTrim.app: Video trimmer app in the browser.
• Virus Wars: Virus Wars game with local multiplayer (no single player).
• Wave-PD1: Synth toy.
• WebAPI check: Open this PWA to check which WebAPIs are available on your current device.
• Word Counter: Count characters, words, sentences, paragraphs, pages.
• WordDB: Word finder, thesaurus, dictionary, crossword solver, rhyme finder and more.
• Wormhole: Share files with end-to-end encryption.
• X Sound: Online keyboard synth.
• Yahtzee: Dice generator.
• Youtube Music: Music streaming via YouTube.
• ztable.io: Z-Table lookup & Z-Score calculator.
• webpushtest: Web Push Notifications Demo

Tutorials

• Build a realtime PWA using Vue.js
• Build a realtime PWA with React
• Getting started with Progressive Web Apps by @addyosmani
• Google Developers - Progressive Web Apps
• Introduction to Progressive Web Apps by Google-Udacity
• Introduction to progressive web apps
• Progressive Web Apps with React.js - 4 part series by @addyosmani
• Retrofit an Existing Website as a Progressive Web App
• Service Worker Cookbook - Mozilla
• Web Powered SMS Inbox with Service Worker: Push Notifications

Articles

• A Beginner’s Guide to Progressive Web Apps & the Frontend Web
• A full-stack solution for fast PWA development
• A Tinder Progressive Web App Performance Case Study
• Are Progressive Web Apps the Future?
• FLIP your animations
• From Electron to Progressive Web App
• How I built a Progressive Beer App
• How I made a Progressive Web App out of my Blog
• How we made our website offline first
• How to build a PWA from scratch with HTML, CSS, and JavaScript
• IndexedDB, WebSQL, LocalStorage – what blocks the DOM?
• Installable Web Apps with the WebApp Manifest in Chrome for Android
• Integrating Progressive Web Apps deeply into Android
• Introducing Pokedex.org: a progressive webapp for Pokémon fans
• Introduction to Progressive Web App with example
• Intro to (Progressive) Web Apps
• Is Service Worker ready?
• Progressive web apps have leapfrogged the native install model ... but challenges remain/
• PWA Performance
• PWA - E-Commerce - Compare List
• Say Hello to Offline First
• Service Worker - Revolution of the Web Platform
• Service Workers: Dynamic Responsive Images using WebP Images
• Support for theme-color in Chrome 39 for Android
• Swift Migration to Progressive Web App
• The Building Blocks Of Progressive Web Apps
• The web app "discovery problem"
• What Progressive Web Apps Mean for the Web
• You’re Missing the Point of Server-Side Rendered JavaScript Apps

Videos

• AMP + Progressive Web Apps: Start fast, stay engaged - Google I/O 2016
• Angular 2 and Progressive Web Apps - Google I/O 2016
• Breaking the 1000ms Time to Glass Mobile Barrier (vid)
• Building a Progressive Web App - Aditya Punjani
• Building and deploying a Progressive Web App at scale with Flipkart (Chrome Dev Summit 2015)
• Building for Billions (Progressive Web App Summit 2016)
• Building for billions on the web - Google I/O 2016
• Building Progressive Web Apps with Polymer (Chrome Dev Summit 2015)
• Building the Google I/O Web App: Launching a Progressive Web App on Google.com - Google I/O 2016
• Deep Engagment with Push Notifications (Progressive Web App Summit 2016)
• Fast and resilient web apps: Tools and techniques - Google I/O 2016
• Fireside Chat with the Progressive Web Apps Crew - Google I/O 2016
• Going Big: PWAs Come to Desktop and Chrome OS (Google I/O ’19)
• Great libraries and tools for great Progressive Web Apps - Google I/O 2016
• Houdini: Demystifying the Future of CSS - Google I/O 2016
• Instant loading with HTTP/2 (Progressive Web App Summit 2016)
• Instant Loading: Building offline-first Progressive Web Apps - Google I/O 2016
• Instant-loading Offline-first (Progressive Web App Summit 2016)
• Interview with Google Software Engineer Alex Russell - O'Reilly Fluent Conference 2016
• Konga (Progressive Web App Summit 2016)
• Mythbusting HTTPS (Progressive Web App Summit 2016)
• Opening Keynote (Progressive Web App Summit 2016)
• Polymer and Progressive Web Apps: Building on the modern web - Google I/O 2016
• Polymer Summit 2016 Youtube Playlist
• Progressive Web Apps (Chrome Dev Summit 2015)
• Progressive Web Apps across all frameworks - Google I/O 2016
• Progressive web apps and what's next for mobile
• Progressive Web Apps and What's Next for Mobile
• Progressive Web Apps Are Easy Now - Or Are They with Thorsten Lorenz -- UtahJS 2018
• Progressive Web Apps in any context (Progressive Web App Summit 2016)
• Progressive Web Apps on Firebase - Google I/O 2016
• Progressive Web Apps Training 2019 - Playlist
• Progressive Web Apps with Alex Russell
• Progressive Web Apps: the future of Apps
• Progressive, Performant, Polymer: Pick Three - Google I/O 2016
• Putting the Progressive in Progressive Web Apps (Progressive Web App Summit 2016)
• PWA starter kit: build fast, scalable, modern apps with Web Components (Google I/O '18)
• PWA Training Course 2017 Playlist with Sarah Clark, Google Developers India
• Samsung internets progressive web app commitment (Progressive Web App Summit 2016)
• Search and the mobile content ecosystem - Google I/O 2016
• Service workers at scale with Facebook and Flipkart - Google I/O 2016
• Summit Report: Building for billions with Progressive Web Apps (Progressive Web App Summit 2016)
• Summit Report: Checking in with Paul Lewis and Jake Archibald (Progressive Web Apps Summit 2016)
• Summit Report: Making Progressive Web Apps accessible, at scale! (Progressive Web App Summit 2016)
• Summit Report: Progressive Web Apps for any occassion! (Progressive Web App Summit 2016)
• Summit Report: Reach, acquisition and conversion (Progressive Web Apps Summit 2016)
• Summit Report: Talking HTTPS with Emily Schechter (Progressive Web App Summit 2016)
• Summit Report: The Web Developers swarm! (Progressive Web Apps Summit 2016)
• Summit Report: What do I need to know about HTTP2? (Progressive Web App Summit 2016)
• Summit Report: Why's it called a Progressive Web App? (Progressive Web App Summit 2016)
• The applied science of runtime performance (vid)
• The Future of Progressive Web Apps (Progressive Web App Summit 2016)
• The Mobile Web: State of the Union - Google I/O 2016
• The Service Worker is Coming - Look Busy (vid)
• To the Lighthouse (Progressive Web App Summit 2016)
• Tools for Success (Progressive Web App Summit 2016)
• UI Elements at 60fps (Progressive Web App Summit 2016)
• Unlocking New Capabilities for the Web (Google I/O ’19)
• Using Web Components to Build PWAs (Progressive Web App Summit 2016)
• V8, modern JavaScript, and beyond - Google I/O 2016
• Who are you, really: Safer and more convenient sign-in on the web - Google I/O 2016
• Why Build Progressive Web Apps? - Playlist

Tools

• @forlagshuset/simple-fs: Needs offline filesystem? SimpleFS provides sweet promise based nodejs file API on top of indexeddb.
• a2hs.js: A useful modern JavaScript solution that helps your website users to add (install) a progressive web app to the Home Screen of their mobile iOS devices.
• DSW: Generate your Service Worker dynamically, webmanifest, rules for requests, redirects, etc.
• fetch-manifest-json: Fetch the mainfest.json from an URL.
• fetch-sync: Proxy Fetch requests through the Background Sync API
• HNPWA: Hacker News readers as Progressive Web Apps. A spiritual successor to TodoMVC.
• Manifest Generator: This simple page will generate the manifest file for you.
• manifest-json: CLI tool for creating mainfest.json.
• msgr: Nifty service worker/client message utility
• offline-plugin: Offline plugin (ServiceWorker, AppCache) for webpack (http://webpack.github.io/)
• PWA Asset Generator: Automates PWA asset generation and image declaration. Automatically generates icon and splash screen images, favicons and mstile images.
• PWAify: CLI tool to convert your PWA into a cross-platform desktop app.
• serviceworker-rails: Plugin to integrate Service Worker with the Rails asset pipeline.
• serviceworker-webpack-plugin: Simplifies creation of a service worker to serve your webpack bundles.
• serviceworkerware: An Express-like layer on top of ServiceWorkers to provide a way to easily plug functionality
• sw-delta: An incremental cache for the web.
• sw-precache-webpack-plugin: SW Precache Webpack Plugin
• sw-precache: A node module to generate service worker code that will precache specific resources
• sw-toolbox: A runtime caching library
• 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
• Workbox: Javascript Library for building progressive web apps
• pwa-badge: Badging for PWA app icons, Like Native Apps

Kits

• Bento starter: Full-stack solution to build Progressive Web Apps.
• Progressive Web Application skeleton: A simple set of skeleton files for shipping a Progressive Web App.
• pwabuilder: All the tools you need to build and deploy your Progressive Web Apps.
• Web Starter Kit: A workflow for multi-device websites.
• Polymer App Toolbox: "a collection of components, tools and templates for building Progressive Web Apps with Polymer"
• Preact CLI: "Your next Preact PWA in 30 seconds"
• Simple PWA: A Progressive Web App template that provides the minimum file structure needed to create a PWA
• Stencil PWA toolkit: Ionic's "Everything you need to easily build fast, production ready Progressive Web Apps"

Courses

• Developing Progressive Web Apps Course (free)
• Getting Started with Progressive Web Apps (paid)
• Intro to Progressive Web Apps (free)
• Learn to build progressive web apps using JavaScript (paid)
• Progressive Web App Fundamentals (paid)
• Progressive Web Apps - The Concise PWA Masterclass (paid)
• Progressive Web Apps (PWA) - From Beginner to Expert (paid)
• Progressive Web Apps (PWA) - The Complete Guide (paid)

Conferences

• A list of conferences talking about PWA