This content originally appeared on DEV Community and was authored by Shubham
Updating pwa
Whenever you change the version of service worker the app gets auto updated.
And also you can show interface for update.
But You have to make cool app like Amazon android which updates automatically when Amazon wants.
let's get started
To make app like that you have to cache only your index.html.
(If you have to give styled interface , you can add style.css also)
index.html
...
<div id="app" class="full-body">
<H1>You're offline<H1>
</div>
<script src="update.js"></script>
...
one script that will update content.
If you are using the framework like MDL or bootstrap.You have to place their scripts after update.js
update.js
var template = "you're online now";
var app = document.querySelector("div#app");
app.innerHTML=template;
This is process which will update your app when you will update the template variable
Making more complex
In my app I have created 3 tabs which are create,markdown to pdf, settings.
Each tab have it's own template file.
You can check here.
NotableAPP
/
Formal-stack-pdfs
Make pdf from image , markdown and more is coming...
Formal-stack-pdfs
Hey there this is app where you can create pdfs with jsPDF library and our ui/ux this will help you to convert the images into pdf
App running at - https://formal-stack.netlify.app/
And whenever the js file reads it on tab is changed and display content after reading means in my app content is purely synchronous with user .
You can check here :
https://formal-stack.netlify.app/
Example of my app
In my app you can see I have created a loader and different tabs when you tap on tab the html template for that tab loads and the loader hides.
On every click on tab button the ui.js file reads the page template stored in pages directory and shows content.
You can see here https://github.com/NotableAPP/Formal-stack-pdfs/tree/main/APP/pages
In my app I have created my own extension which is .stackformal.In this type of file I have stored the html code which appears on the call means on tab opened.
Written by SGI with ?
This content originally appeared on DEV Community and was authored by Shubham
Shubham | Sciencx (2021-09-04T05:12:25+00:00) PWA || MAKING APP synchronous || Auto update assets. Retrieved from https://www.scien.cx/2021/09/04/pwa-making-app-synchronous-auto-update-assets/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.