So veröffentlichen und aktualisieren Sie Ihre Progressive Web App

Ihre PWA

Ihre App kann auch eine Progressive Web App sein, kurz PWA: eine Website, die wie eine App funktioniert, in jedem Browser, auf Smartphone oder Computer, ohne Store. So veröffentlichen (aktivieren) Sie sie und halten sie aktuell.

Alles beginnt mit „Publish my project“ oben auf jeder Seite. Ihre PWA ist sofort verfügbar, ohne Voraussetzungen.

Vor dem Veröffentlichen

Geben Sie Ihrer PWA vor dem Veröffentlichen ihr Symbol: Unter „My App“, „App icon“, Custom ist es das „Apple Touch Icon“ unter PWA.

Öffnen Sie dann in der Seitenleiste Publish, PWA, Publish: die Seite „PWA publication“.

Mit fünf optionalen Schritten gehen Sie weiter: eigener Domainname, Suchmaschinenoptimierung, Web-Push-Benachrichtigungen, ein Kartenschlüssel und eine Sitemap. Keiner davon ist Pflicht.

Ein Hinweis meldet, wenn eine Funktion in einer PWA mehr braucht: Hier benötigt eine Funktion mit Geolokalisierung einen API-Schlüssel.

Und unter Redirection legen Sie fest, wohin Besucher kommen, falls Sie Ihre PWA deaktivieren.

Ihre PWA veröffentlichen

Sind Sie bereit, klicken Sie auf „Publish my PWA“.

GoodBarber generiert Ihre PWA. Das dauert ein paar Minuten.

Ihre PWA ist online, unter eigener Adresse. Folgen Sie dem Link oder scannen Sie den QR-Code mit dem Smartphone.

Zum Deaktivieren klicken Sie auf Disable: Besucher kommen dann dorthin, wo Sie es unter Redirection gewählt haben.

Unter „Publish my project“ ist Ihre PWA nun Live.

Ihre PWA öffnen

Öffnen Sie ihre Adresse in einem beliebigen Browser. Am Computer erscheint Ihre App als Website.

Auf dem Smartphone sieht sie aus wie Ihre App.

Besucher können sie auch installieren: im Chrome-Menü mit „Install and create shortcut“.

Ein Tippen auf Install… und Ihr Symbol steht bei ihren Apps… und öffnet sich im Vollbild, wie eine native App.

Ihre PWA aktualisieren

Ändern Sie nun etwas in Ihrer App, zum Beispiel im Header die „Logo color“.

Die Vorschau zeigt es sofort… Ihre PWA aber nicht, denn sie zeigt, was Sie zuletzt veröffentlicht haben.

„Publish my project“ zeigt „Update now“: Änderungen warten auf ihre Veröffentlichung.

Unter Publish, PWA, Update listet „Live update“ die Änderungen, die mit „Update now“ live gehen.

Andere Änderungen, etwa eine neue Erweiterung oder Berechtigung, erfordern ein Neuerstellen Ihrer PWA: Diese warten hier, bis Sie auf „Rebuild my PWA“ klicken.

Zum Veröffentlichen öffnen Sie „Publish my project“ und klicken auf „Update now“… und bestätigen dann.

Wenige Sekunden später ist Ihr Projekt aktualisiert.

Laden Sie Ihre PWA neu: Die Änderung ist da. Besucher sehen sie beim nächsten Öffnen.

Neue Inhalte

Inhalte sind anders: Veröffentlichen Sie einen Artikel in einem Ihrer Bereiche… und er ist sofort in Ihrer PWA, ganz ohne Aktualisierung.

„Publish my project“ zeigt weiter „Project updated“. Ab jetzt veröffentlichen Sie hier Ihre Änderungen.