16th Javascript Project - Add Website to Cache and View Offline Tutorial with Source Code

Published: 25 May 2020
on channel: UI Monk

add website to browser cache and view offline Source Code:
https://drive.google.com/open?id=1b0u...

Whats in this video
1. how to add css,js,html files in browser cache
2. how to delete old cache
3. how to preserve Log in chromeinspector
4. how to offline in chromeinspector
5. how to view cache files in chromeinspector

steps to follow:
1. register serviceworker
1.1 check if serviceworker is allowed in your chrome browser
1.2 add listener to windows
1.3 register using inbuilt function navigator.serviceWorker.register()

2. install serviceworker
2.1. add listener 'install' to self i.e registered serviceWorker
2.2. use waitUntil() function
2.3. create cache key
2.4. choose cache files and store in array
2.5. open cache using default function caches.open()
2.6. use addAll() function to load the cache files
2.7 exit from waiting using self.skipWaiting()
2.8 try adding new version - it will accept
2.9 try to go offline and check, its not activated yet

3. activate serviceworker
3.1. add listener activate' to self i.e registered serviceWorker
3.2. use waitUntil() function
3.3. get all keys in cache file
3.4 return all keys to delete the old one using promise.all()
3.5 use map() function of array to perform operation(delete old)
3.6 return and delete the old cache files using caches.delete()
3.7 try adding new version it will delete the old cache files
3.9 try to go offline and check, data is not fetched yet

4. fetch serviceworker
4.1. add listener fetch' to self i.e registered serviceWorker
4.2 use respondWith() function
4.3 fetch the request
4.4. if it fails use the cache file

This is the completed UI Design Javascript Tutorial. I created along with my 3years experience in Javascript UI Development. I have left the source code for every javascript ui tutorial for free.

contact me anytime for the source code:
agnelndrvishal@gmail.com

On this page of the site you can watch the video online 16th Javascript Project - Add Website to Cache and View Offline Tutorial with Source Code with a duration of hours minute second in good quality, which was uploaded by the user UI Monk 25 May 2020, share the link with friends and acquaintances, this video has already been watched 81 times on youtube and it was liked by 2 viewers. Enjoy your viewing!

117