A progressive web app that was used during the MaltaJS presentation that demonstrates the use of Service Workers, Cache API and offline functionality; the use of a Manifest for Web and Add to Homescreen.
- Run npm install in the root directory to install all dependencies
- Run npm start to run gulp and start a local dev server using ExpressJS
“Progressive web apps are ordinary mobile-friendly web applications that may be progressively enhanced into native-like applications through the modern browser.”
At it’s core, a PWA is little more than an ordinary website; composed of HTML, CSS & JavaScript.
A website must be built in a structured-layered approach, with rock-solid HTML & content and enhancements added to improve the user’s experience.
The most exciting aspect of a PWA is definitely the native-like user experience and features. A progressive web app is able to work offline, receive push notifications and should be optimized to work flawlessly on mobile devices.
The “app-shell” could be compared to the code you would publish to the app store if you were building a native app. Inspiration taken from application-shell.
A service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don't need a web page or user interaction.
A simple JSON file that must follow the specification available on [W3C](a href="https://w3c.github.io/manifest/" target="_blank"), it is possible to run the web app in full-screen as a standalone application, assign an icon which will be displayed once the application is installed onto the device or assign a theme and background colour to your app. In addition, Chrome on Android also proactively suggests to the user to install the web app using Web App install banners.
Built using traditional HTML5 and vanilla JavaScript that simulates the retrieval of data from a mock API. Throughout the application we use small bits of KnockoutJS to handle client-side bindings, Handlebars for server-side JavaScript templates and ExpressJS to host the application.