Build and Distribute a Progressive Web App
Build and Distribute a Progressive Web App
Power Pages enables organizations to transform websites into Progressive Web Apps (PWAs), providing a native app-like experience across desktops, tablets, and mobile devices. Makers can enable PWA functionality, customize branding, configure offline access, and distribute applications through browsers or official app stores.
With built-in support for PWABuilder, Power Pages simplifies the process of creating installable applications that can be published to Android, iOS, and Windows app stores while maintaining a single web-based solution.
Enable Progressive Web App Features
To enable Progressive Web App functionality in Power Pages:
- Open Power Pages.
- Select your website.
- Choose Edit.
- Navigate to Set Up Workspace → Progressive Web Application.
- Turn on Enable PWA.
Brand Your Application
Customize the Progressive Web App to match your organization's branding requirements.
- Application Name
- Start Page
- Theme Colors
- Background Colors
- Application Icons
- Branding Settings
These settings help create a consistent user experience across browsers, mobile devices, and app stores.
Configure Offline Pages
Power Pages allows selected pages to remain accessible even when users do not have an internet connection.
- Open Set Up Workspace → Progressive Web Application.
- Under More Settings, select Define Offline Pages.
- Select the pages that should remain available offline.
- Save the configuration.
Offline pages are available in read-only mode and help users access important information when connectivity is unavailable.
Set Up an Offline Message Page
When users attempt to access content that is not configured for offline use, Power Pages displays an offline message page.
- Open the Pages Workspace.
- Select Default Offline Page.
- Customize the page content and design.
- Save and publish the changes.
Test the Portal in Offline Mode
After configuring offline pages, validate the experience using a mobile device.
- Open the portal in a mobile browser.
- While online, select Add to Home Screen.
- Install the application.
- Switch the device to offline mode.
- Launch the application from the home screen.
- Verify offline pages load correctly.
Distribute the Application Through a Browser
Once PWA functionality is enabled, users can install the application directly from supported browsers.
- Android Devices
- iOS Devices
- Windows Computers
- Chromebooks
- Mobile Phones
- Tablets
- Desktop Browsers
Users can pin the portal to their device home screen and launch it like a native application.
Distribute the Application Through App Stores
Power Pages supports publishing Progressive Web Apps to Android, iOS, and Windows app stores using PWABuilder.
- Open the Set Up Workspace.
- Navigate to Progressive Web Application.
- Select Create App Package.
- Generate the application package.
- Download the package.
- Submit the package to the desired app store.
Android Certificate Configuration
For Android deployments, you can update certificate information to verify ownership of the Progressive Web App.
- Update Android Certificate Information.
- Modify Application Title.
- Provide SHA-256 Certificate Fingerprint.
- Refresh the assetlinks.json file.
- Verify ownership of the application.
Benefits of Progressive Web Apps
- Native app-like experience.
- Cross-platform compatibility.
- Offline access support.
- Easy installation.
- App store distribution.
- Improved user engagement.
- Reduced development effort.
- Single codebase management.
Best Practices
- Configure branding before publishing.
- Test offline functionality thoroughly.
- Use meaningful offline messages.
- Validate browser compatibility.
- Monitor app performance after deployment.
- Keep certificates updated for Android packages.
- Review app store requirements before submission.
Summary
Power Pages makes it easy to build, brand, test, and distribute Progressive Web Apps. By enabling PWA functionality, configuring offline experiences, and publishing through browsers or app stores, organizations can deliver modern application experiences while maintaining the flexibility and simplicity of a web-based solution.