Make ExtremeSetup a PWA part 1


Published 1 year ago

We are happy to announce that we already started to make our website https://extremesetup.com/ a Progressive Web App. In this series, we are going to illustrate the process of making an existent website a PWA. If you want an introduction and benefits of PWA, you can read our article about PWA. If you already decided to implement your own PWA then this guide will be helpful for you in this process. This series will not go deep into all the technical details of this process. You can check more technical details here. In this series, we will show general aspects of this process, steps to take to implement PWA successfully and a general estimation of the amount of work to be done from a business perspective. All these being said let's get started step by step.

 

Move to HTTPS

This is the first condition to start implementing PWA. HTTPS means your website is secure by encrypting the data sent over the internet between user and website. In the past, it was important for online payment systems, personal information and other sensitive data. Currently, using HTTPS protocol is promoted by all major players from the  IT industry, because any relationship between a user and the service should remain private. For a PWA implementation, it's a must. Today there is a cool service Letsencrypt (you can find how to do this on their website) allowing implementing encryption for free, but you can donate of course if you wish. At the end, you should have something like this which means your website is secure.

Move to HTTPS 

 

 Make it responsive

Like HTTPS this feature is important for any successful website not only PWA but for PWA it's a must. Our website should look great on any screen size, any device like smartphones, tablets, laptops desktop computers and any devices to come.

ExtremeSetup is responsive

 

Optimize performance

Time is more than money and we value the time of our users. The website should load as fast as possible by optimized javascript code, minified HTML, CSS, js files, remove big size images where possible, remove unnecessary plugins, reduce server response time, leverage caching and other techniques. A fast website will provide a native feel when it will be transformed into a PWA by reducing latency. Users should not feel the delay of the network in regions where internet speed is slower. It should load fast on a 3G network.

 

Conclusion: Let's finish here our first part since we accomplished here a lot already. These are prerequisites for preparing our PWA. What we discussed here makes sense to any modern website today but for a PWA - it's a must, so if you plan to build a PWA or make an existent project a PWA you should take care about this first. In the next part, we are going to build actual PWA.