Complete Mobile App Tutorial With Only HTML, CSS and JavaScript | PWA Tutorial

Here’s how to build mobile apps with JavaScript + HTML and CSS. We’ll be working with Dexie.js and IndexedDb for offline storage, and Google Workbox for generating our service worker. This is an easy-to-understand project-based tutorial. Like and subscribe!

If you’re looking for a practical and enjoyable way to learn JavaScript, I wrote the perfect book for you: https://www.newdev.io/vip-javascript

Get Simplified JavaScript for VIPs on Amazon: https://www.amazon.com/dp/B0BW38DCB1

My frontend guide: https://newdev.io/devguide/frontend
Link to the image icons: https://github.com/ebenezerdon/shopping-app-images
Link to the hosted app: https://ebenezerdon.github.io/shopping-app/
Link to my course on IndexedDb: https://youtu.be/efw7PtwD-0k

Follow me on LinkedIn: https://linkedin.com/in/ebenezerdon
Follow me on Twitter: https://twitter.com/ebenezerDN
Follow me on GitHub: https://github.com/ebenezerdon

Outline:

Introduction – 00:00:00
What we’re building – 00:00:56
Setting up our app – 00:04:14
Structuring our app with HTML – 00:06:02
Styling our app with CSS – 00:09:22
Setting up Dexie.js in our shopping app – 00:13:01
Adding items to our IndexedDb database – 00:16:23
Getting items from our IndexedDb database – 00:19:27
Creating a function to calculate our items total price – 00:23:24
Displaying items in our shopping app – 00:25:38
Updating data in our IndexedDb database – 00:28:26
Deleting data from our IndexedDb database – 00:31:04
Setting up Workbox for PWA – 00:32:37
Generating our Service worker – 00:34:00
Making our app installable – 00:38:38
Challenge – 00:42:22

#webdevelopment #coding #programming #pwa #mobiledevelopment

You May Also Like