• This repository has been archived on 31/Jan/2020
  • Stars
    star
    864
  • Rank 52,774 (Top 2 %)
  • Language
    HTML
  • License
    Apache License 2.0
  • Created almost 9 years ago
  • Updated almost 5 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A selection of Progressive Web Apps

List of Progressive Web Apps Build status

What is a progressive web app? See the β€œProgressive Web Apps” talk by Alex Russell and Andreas Bovens.

Contributing

We’re happy to feature other nice-looking progressive web apps in the list. They should:

  • Be served over HTTPS.
  • Have a manifest with a short_name and name, start_url, and a PNG icon of at least 144Γ—144 pixels.
  • Have a service worker (making sure that the start_url functions offline).

This combination of features will trigger the web app install banner in Opera and Chrome (to trigger it on the first visit, we recommend enabling Bypass user engagement checks option in chrome:flags or opera:flags), unless the site is intercepting onbeforeinstallprompt. In the latter case, the banner is triggered at a custom point in time, defined by the site’s own logic.

How to Suggest an App

  • Fork this repository.
  • Create a branch, name it after your app.
  • Add an icon (preferably SVG) to the apps folder.
  • Add an entry to the src/index.html file:
<a class="list__item app js-app"
		href="URL"
		data-app="ID"
		data-tags="TAGS">
	<div class="app__wrapper">
		<h2 class="app__title">
			TITLE
		</h2>
	</div>
	<style>
		[data-app='ID'] {
			color: COLOR;
			background: currentColor url(apps/ID.svg) 50% 50% / 50% auto no-repeat;
			}
	</style>
</a>
  • Test it locally by opening the src/index.html file in your browser.
  • Commit all changes to your app branch and create a pull request.

Development

  • Fork this repository.
  • Create a branch, name it after the feature you’re implementing.
  • Clone it locally and start making changes.
  • Test it locally by opening the src/index.html file in your browser.
  • Commit all changes to your feature branch and create a pull request.

For full-scaled development and testing you can use the build system:

  • npm run server for the dev server and light build.
  • npm run build for the full build with caching.