![toweb tutoriel toweb tutoriel](https://i0.wp.com/howto.digioh.com/wp-content/uploads/2020/04/13.jpg)
Once the cache is created it adds all of the files listed in the filesToCache array. Next, we add a function to install the service worker and create the browser cache using cacheName. This is so the browser caches index.html even if the user doesn’t directly type in that file name. Notice that the first one is simply “/”, the base URL. These files should be written in the form of URLs. filesToCache is an array containing a list of all of the files that need to be cached. cacheName is used to create an offline cache in the browser and give us access to it from Javascript.
![toweb tutoriel toweb tutoriel](https://www.tutorialbar.com/wp-content/uploads/1473530_cf6f_3-2048x1152.jpg)
The first lines of the script declares two variables: cacheName and filesToCache. Open your project folder in Brackets to get started. It should look like this when you’re finished: /Hello-PWA # Project Folder /css # Stylesheets /js # Javascript /images # Image files. The SetupĬreate a directory for the app and add js, css, and images subdirectories. I’ve used Adobe’s Brackets in this tutorial, because it has a built in web server, but you can use any text editor and server combo you’re comfortable with. To build this app you’ll need a text editor, the latest version of Chrome and a local web server. If you can code a web page and use plain-vanilla JavaScript to add some interactivity you should be able to follow along. To get the most out of this tutorial you should be familiar with HTML, CSS and JavaScript. In this tutorial I’ll show you how to use a manifest and service workers to create just about the simplest app possible, one that works without an internet connection, and can be added to your home screen. If you’re not familiar with Progressive Web Apps the basic idea is to use browser technologies to build a web application that works offline and has the look and feel of a native application.