15 Minute Progressive Web App Upgrade Tutorial смотреть онлайн

Its easy to upgrade any web site to a progressive web app. This Progressive web application tutorial shows how to upgrade the HTML5 Boilerplate project to a progressive web app in about 15 minutes.

Want to learn everything about Progressive Web Application development? Register for my Progressive Web Application Course: https://PWACourse.com.

Anytime there is a new technology or new way to solve a programming problem developers need to know how to start. I see questions asked across different channels about how to start, how to upgrade an existing web site or how does this work with different stacks.

The great thing about progressive web applications is they are additive to any web site, completely decoupled from any stack or framework you might be using.

Let’s review the purely technical requirements to be a progressive web app. A site must be served via HTTPS, have a web manifest with a minimal set of icons and register a service worker with a fetch event handler.

These are the minimal requirements to trigger the add to home screen experience in Chrome. This means you can spend 10-15 minutes ‘upgrading’ any existing site to be a progressive web application without changing the site’s integrity.

To demonstrate a simple upgrade I have forked the HTML5 Boilerplate project to demonstrate the process.
https://github.com/docluv/html5-boilerplate-1

The HTML5 Boilerplate project is a great started example site for any modern web site project. It can serve as a baseline progressive web app example after I upgrade the source code.

The 3 Key Technical Requirements are:

HTTPS
A Web Manifest and Icon Images
https://developer.mozilla.org/en-US/docs/Web/Manifest
A Basic Service Worker

If you have followed along you now have a basic reference project that meets the minimal requirements to be a progressive web application. Remember when you deploy to have an SSL certificate installed. Create and reference a web manifest file. Add an array of icons to be used for the home screen. And register a service worker with a fetch event handler.

Any site can do these three tasks very quickly. All three are additive and not required for a site to function. But adding these features trigger modern browsers to prompt the user to add the site to their home screen and thus be a minimal progressive web application.
I challenge you to enhance any existing site you currently have or manage to meet these requirements. It should not take more than 15 minutes and begin you on your journey to a good progressive web application experience.

Read the Blog Post - https://love2dev.com/blog/15-minute-progressive-web-app-upgrade/

Get social with Love2Dev on:
Facebook: https://www.facebook.com/Love2dev
Twitter: https://twitter.com/ChrisLove
G+: https://plus.google.com/b/110904107389779237581/?pageId=110904107389779237581
Linkedin: https://www.linkedin.com/in/love2dev
Pinterest: https://www.pinterest.com/docluv/