New PWABuilder release!

Towards the end of last year we expanded the PWABuilder team and decided on some new directions for PWABuilder which David Rousset talked about in our last post, PWA Builder new team & new directions. Today I am excited to announce our first new release of 2020! This is a big release for PWABuilder and fixes a lot of the pain points the community had, along with some awesome new features and other improvements, lets dive in!

PWABuilder works everywhere

One of the biggest things the community requested was for PWABuilder to work well on mobile / smaller tablet devices. The PWABuilder project is a large codebase with some challenges that made the design not as responsive as we wanted. In this release we went through and solved these challenges and now we are happy to say that PWABuilder now works great no matter what size device you are on!

Packaging your PWA for Android

While PWAs have traditionally been focused on distribution through the web (and this is a good thing!), users are still used to getting their apps from an app store. Because of this it is important that your PWA is also able to be shipped to an app store, in this case the Google Play Store. Google has enabled this with the introduction of Trusted Web Activities, which enables you to “wrap” your PWA for the Play Store. The only problem here is the complexity involved in packaging your PWA into a Trusted Web Activity(TWA) https://developers.google.com/web/updates/2019/02/using-twa.

Because of this we decided to take a look and see what we could do to make things easy and luckily found that a team at Google was also focused on the same goal with llama-pack! Llama-pack is an awesome tool that handles generating, signing and building your PWA into a TWA, exactly what we were looking for. Judah worked with the llama-pack team to enable us to integrate the tool into our backend and with this release developers can now generate, build AND sign a TWA all without leaving the PWABuilder site. All you have to do is:

Enter the URL to your PWA at https://pwabuilder.com and hit the start button

Tap the `Build My PWA` button and then choose the Android platform.

Tap the download button and PWABuilder will run llama-pack behind the scenes on your PWA and give you a zip folder with everything you need to deploy your PWA to the Google Play store! No Android Studio required, the APK and Cert are in the zip 🎉🎉.

Note: If you are using this to update an existing APK you have already deployed to the Google Play Store you may need to re-sign the APK with your existing key. You can do this in the Google Play console or use the apksigner tool from Google. Also, we will be adding the ability to submit your own key to sign the APK with in the future, so keep an eye out!

Getting that “app-like” user experience

An important part of the Progressive Web App experience is the “app” part. The app like functionality and feel that PWAs strive for is a massive differentiation between “just a website” and a PWA, but is not always easy to achieve.

To make this easy for developers, PWABuilder’s feature store offers a one stop shop for all the web components you need to take your PWA over the finish line:

Want users to easily be able to install your PWA straight from the browser? We have a component for that. Want users to easily be able to login with their Microsoft account? We have a component for that. And all you have to do is copy and paste some code!

Finally, we are huge fans of the web components that the Microsoft Graph Toolkit team is building and wanted to give developers using PWABuilder an easy way to use those components. We now have a special Microsoft Graph category in our store that makes using Microsoft Graph components like the `mgt-login` component as easy as copy and pasting a tiny amount of code.

Let us know how you like the new Android TWA platform and Feature store, I personally love how easy it is to setup Microsoft Account authentication using the Microsoft Graph Login component, and it works great when packaged as a TWA too! We are very excited to see all the energy in the PWABuilder community over the last few months and we have even more improvements coming soon to the project. Keep an eye on our new Twitter account for announcements, thanks!