PWA
- At below info,
Navigate to login page of Wekanis your Wekan server, example https://wekan.yourcompany.com/sign-in - App icon at Windows desktop, mobile etc
- App does not have webbrowser buttons like address bar
- Works in Wekan v4.02 and newer
-
Open Chromium Edge.
-
Navigate to login page of Wekan
-
From Edge menu, install site as app, by clicking top right
⋮and this menu, that can be used to install and manage/remove apps:
-
In next popup, give name to app, like
YourCompany Wekan, and clickAdd -
Now new app is in your Windows Start menu.
-
Open Safari.
-
Navigate to login page of Wekan.
-
At middle bottom click Share button that is box with arrow up.
-
Scroll down and click "Add to Home Screen" and "Add".
-
Open Chrome
-
Navigate to login page of Wekan.
-
Click top right menu
⋮/ Add to home screen. -
Follow the onscreen instructions to install.
-
Open Firefox.
-
Navigate to login page of Wekan.
-
At right side of URL address, click button that has + inside of home icon.
-
Follow the onscreen instructions to install.
-
Open Brave.
-
Navigate to login page of Wekan.
-
Click bottom right menu
⋮/ Add to home screen. -
Follow the onscreen instructions to install.
-
Open Opera.
-
Navigate to login page of Wekan.
-
Click top right menu
⋮/ Add to / Home screen. -
Follow the onscreen instructions to install.
-
Open Vivaldi.
-
Navigate to login page of Wekan.
-
At right side of URL address, click [V] / Add to home screen.
-
Follow the onscreen instructions to install.
PWA style app at some app store (in this case: Android Play Store, Windows desktop Microsoft Store, Ubuntu Touch OpenStore, see https://wekan.team/app/ ) is like fullscreen webbrowser to URL, so updating backend (like Meteor 2 website, Meteor 3 website, other web framework website) does not require releasing new app to app store. This does not use Cordova. App is created at website pwabuilder.com .
These are mostly just notes to WeKan maintainer xet7 itself, how xet7 did get official WeKan Android Play Store app working at fullscreen of Android phone and Android tablet. Also at other app stores, more info at
Related, for creating apps to other appstores: https://github.com/wekan/wekan/wiki/Browser-compatibility-matrix
- https://www.pwabuilder.com to create Android app. Select fullscreen when creating app, also requires correctly installed assetlinks.json with below Caddy config to get fullscreen. When creating app, make your own signing key if you don't have one yet. Releasing Android app is at Play Console https://play.google.com/console/ .
- id: com.company.someapp.twa
- Web view (Custom Tabs did not work)
- Fullscreen
- Notifications [X] Enable
- Signing key [X] Create new, or if already created, use mine, load from file
- Version: 1.0.0.0 (next I used were 2.0.0.0, 3.0.0.0)
- Version code: 1 (next I used were 2, 3)
-
Upgrade to Android 14 target SDK 34 like this: https://www.youtube.com/watch?v=DbarW15E058 . This was mentioned at https://github.com/pwa-builder/PWABuilder/issues/4766#issuecomment-2229867608
-
PWABuilder has about 100+ downloadable icons etc webmanifest requirements like is at https://github.com/wekan/wekan/tree/main/public . It was mentioned at https://github.com/pwa-builder/PWABuilder/issues/4766#issuecomment-22 . Minimum site.webmanifest is like this:
{
"name": "MyApp",
"short_name": "MyApp",
"id": "BixPlat",
"icons": [ {
"src": "https://app.company.com/favicon.svg",
"sizes": "any",
"type": "image/svg"
} , {
"src": "https://app.company.com/favicon.svg",
"sizes": "512x512",
"type": "image/svg"
}
],
"theme_color": "#000000",
"background_color": "#000000",
"start_url": "sign-in",
"display": "fullscreen",
"orientation": "any",
"categories": [
"productivity"
],
"description": "BixPlat",
"dir": "auto",
"scope": "https://app.company.com",
"prefer_related_applications": false,
"launch_handler": {
"client_mode": ["navigate-existing", "auto"]
} ,
"display_override": [
"fullscreen"
]
}
And max all possible is like this https://github.com/wekan/wekan/blob/main/public/site.webmanifest
-
Clone WeKan repo, add favicons etc from step 2 to wekan/public/ , and build WeKan bundle from source like at https://github.com/wekan/wekan/wiki/Emoji . Note: Currently WeKan does not have feature for custom favicons, it would require a lot of work for 100+ favicons etc customizations.
-
Run bundle at server like https://github.com/wekan/wekan/wiki/Offline or https://github.com/wekan/wekan/wiki/Raspberry-Pi . Or use Docker, Snap, etc.
-
Install Caddy like https://github.com/wekan/wekan/wiki/Caddy-Webserver-Config , with this config for PWA at https://boards.example.com , there add assetlinks.json details you got when you downloaded Android .zip file from https://pwabuilder.com , see assetlinks issue about where at Play Console those 2 SHA256 keys https://github.com/pwa-builder/PWABuilder/issues/3867#issuecomment-1450826565
-
At Play Console https://play.google.com/console/ there is
App Integritybutton in the sidemenu (highlighted blue in the screenshot) where you find required 2 SHA256 keys for Caddyfile:
-
Caddy uses tabs for indenting. At
/etc/caddyyou can alsocaddy format > cato format output and forward to new file, and if it works thenmv ca Caddyfileand validate itcaddy validateand reloadcaddy reload. Sometimes update caddy withcaddy upgradeand after thatcaddy stopandcaddy start. -
Also related is Parallel Snaps install to one server at encrypted VM at https://github.com/wekan/wekan-snap/wiki/Many-Snaps-on-LXC
-
In newest requirements installing assetlinks.json is to PWA URL (like https://boards.example.com), when it before was to main domain (like https://example.com), so here just in case it's installed to both, as text in
/etc/caddy/Caddyfile. Also see https://docs.pwabuilder.com/#/builder/android -
For figuring out Caddy 2 config, xet7 found related tips from Caddy forum https://caddy.community/t/well-known-file-location/16632/4
/etc/caddy/Caddyfile
# Redirecting http to https
(redirect) {
@http {
protocol http
}
redir @http https://{host}{uri}
}
example.com {
tls {
alpn http/1.1
}
header /.well-known/* Content-Type application/json
header /.well-known/* Access-Control-Allow-Origin *
respond /.well-known/assetlinks.json `[
{
"relation": ["delegate_permission/common.handle_all_urls"],
"target": {
"namespace": "android_app",
"package_name": "team.example.boards.twa",
"sha256_cert_fingerprints": [
"AA:AA... FIRST SHA256 KEY",
"61:41... 2nd SHA256 KEY"
]
}
}
]`
root * /data/websites/example.com
file_server
}
boards.example.com {
tls {
alpn http/1.1
}
header /.well-known/* Content-Type application/json
header /.well-known/* Access-Control-Allow-Origin *
respond /.well-known/assetlinks.json `[
{
"relation": ["delegate_permission/common.handle_all_urls"],
"target": {
"namespace": "android_app",
"package_name": "team.example.boards.twa",
"sha256_cert_fingerprints": [
"AA:AA... FIRST SHA256 KEY",
"61:41... 2nd SHA256 KEY"
]
}
}
]`
reverse_proxy 192.168.100.3:3025
}