Progressive Web App introduction
20 April, 2018
Hello Everyone! Today we are going to start our new course … Yes! We are back to work and this time we want to teach one more step on web design and where we are evolving in the digital world. You already know that it is not the first web design course we do, but of course, this one is different. Specifically, we will talk about the evolution of new technologies and applications in the world of web design. Here we go!
So…what is the Progressive Web App?
It is a technology promoted by Google, using the latest technologies available in browsers to offer a mobile experience as close as a native application.
These applications use a set of new standards to get a web project to work as an application. These applications reduce the load time, thanks to its cache management, and can work without an Internet connection.
The benefits of using PWA:
- Progressive: It works for all users.
- Adaptable: Fits any format.
- Independent: With this term we mean that, if the user is connected to a bad internet network or has disconnected from the internet, our PWA can continue to function.
- APP style: The user seems an app.
- Fresh: Always update thanks to service worker.
- Secure: Works with SSL certificates, that is, the url starts with https.
- Installable: the user can keep the app.
- Linkable: easily share it.
Next, we will see a video of an interview with Alex Russell developer of this technology:
What is the App Shell?
The part of Shell of our project is going to be stored in cache to give loading speed to our application and also that it can work without an internet connection. This part must have a very fast initial load and be automatically saved in the cache of the device, with this we get better upload speeds, since these elements would be loaded from our device and not from the network.
Next, we will see a video that compares the different types of applications:
Services worker are commands that the browser executes in the background. With this technology we can incorporate functions such as notifications. The main function is the ability to intercept and handle network requests, including the management of the cache.
Manifest.json is a file in JSON format. It is the only file that every Web Extension must contain. In this file we specify the metadata as the name and version.
This file allows you to save an access to our project on the device’s home screen. It has a unique icon and name. Displays content while resources are being downloaded or restored from the cache. Provides default viewing features to the browser to avoid a sudden transition.
To teach this course and deepen even more in the progressives web apps, we will be based on the best material, which is provided by its developers, ie Google. But be attentive to our social networks because we will tell you how we are evolving and above all, our students. Until next time!