Progressive Web Apps (PWA) - The Complete Guide
Build a Progressive Web App (PWA) that feels like an iOS & Android App, using Device Camera, Push Notifications and more
Enroll in Course
Progressive Web Apps (PWAs) are the next big thing in web development as they bring mobile-app-like experiences to your users without requiring them to install an app from the app store/ play store.
You still create a web application (HTML, CSS, JavaScript) but this course will teach you how to add features such as camera access, service workers for offline support, push notifications and more. This combines the best of both worlds: You deliver fast, engaging and reliable experiences whilst still having the reach and accessibility of a web page.
"Progressive Web App" simply is a term summarizing all the features allowing you to deliver mobile-like experiences. The topic is highly trending and it also is a topic which is here to stay! Not only is it strongly promoted by Google (actually a lot of talks at Google I/O 2017, Google's developer conference, were devoted to PWAs), it's also quickly being adopted by big companies like Twitter or the Washington Post.
Having the skills to build and optimize these kind of web apps is already an important and highly demanded skill for modern web developers, a trend which is only going to accelerate! Therefore, learning how to build PWAs will give you a competitive edge!
In detail, this course will cover everything you need to build amazing PWAs - leading to a score of 100 (out of 100) in Google's PWA auditing tool "Lighthouse":
- Detailed explanation about what a PWA exactly is
- How to use an app manifest to make your web app installable on device homescreens
- Using service workers to offer offline support by caching assets
- Advanced service worker usage and caching strategies
- A refresher on Promises and the Fetch API as both concepts are heavily used in PWAs
- How to improve user engagement by adding push notifications
- A way to synchronize data in the background, even if connection is lost
- How to access native device features like the camera or geolocation
- Using Workbox to make service worker management easier
- Explanations on how to turn your next SPA project into a PWA
- And more
All these things are of course put into practice by building a course project. To ensure that you can apply the knowledge to ANY of your projects, the course project doesn't assume any JavaScript framework but focuses on the core features mentioned above!
So this course has a lot to offer, how do you tell if it's for you though?
It definitely is the right choice if ...
- ... you already are a web developer (no matter if experienced or still new to the business) and want to prepare for the future
- ... you enjoy working with HTML, CSS and JavaScript and want to leverage the full power the web and browser technologies have to offer
- ... you want to deliver the best possible experiences to your users, using technologies like web push notifications or offline support
What do you need to know to get the most out of the course?
- You need to know at least the basics of HTML, CSS and JavaScript
- No advanced knowledge of these technologies required though
- You DON'T need to know any JavaScript framework like Angular or React - PWAs work with ANY JavaScript app, even if you don't use a framework at all (actually, that's what we'll build in the course!)
I'd be very happy to welcome you on board of this course and start this journey together with you!
Max
15+
hours
200+
lessons
Course Curriculum
-
PreviewAbout this Course (2:06)
-
PreviewWhat are Progressive Web Apps? (3:24)
-
PreviewPWAs vs Native Mobile Apps (6:07)
-
PreviewJoin our Online Learning Community
-
PreviewA Demo PWA & What We'll Build in this Course (6:24)
-
PreviewOur First Progressive Web App (6:27)
-
PreviewPWA Core Building Blocks (3:19)
-
PreviewComparing PWAs and SPAs (3:17)
-
PreviewWhat is "Progressive Enhancement"? (3:23)
-
PreviewCourse Outline (4:24)
-
PreviewCourse Project Setup (6:09)
-
PreviewHow to get the Most out of this Course (2:11)
-
StartThe Academind Pro Referral Program
-
StartModule Introduction (1:01)
-
StartUsing an App Manifest to Make your App Installable (1:36)
-
StartAdding the Manifest (3:40)
-
StartUnderstanding App Manifest Properties (9:43)
-
StartAdding Properties to the App Manifest (9:44)
-
StartPWAs and Browser Support (2:16)
-
StartUsing the Chrome Developer Tools (1:35)
-
StartSimulating the Web App on an Emulator (4:36)
-
StartInstalling the Web App - Prerequisites (2:30)
-
StartQuiz: Understanding manifest.json
-
StartAdding Properties for Safari (5:50)
-
StartAdding Properties for the Internet Explorer (2:30)
-
StartWrap Up (0:28)
-
StartUseful Resources & Links
-
StartModule Introduction (0:40)
-
StartWhy Service Workers Are Amazing! (4:40)
-
StartUnderstanding Service Worker Events (6:18)
-
StartThe Service Worker Lifecycle (5:19)
-
StartService Worker Browser Support (1:24)
-
StartRegistering a Service Worker (9:26)
-
StartReacting to Incoming Events (in SW) (5:39)
-
StartUpdating & Activating Service Workers (3:00)
-
StartNon-Lifecycle Events (4:49)
-
StartGetting that "App Install Banner" (2:40)
-
StartTesting the App on Real Device (and Installing the App!) (3:42)
-
StartDeferring the App Install Banner (6:43)
-
StartWrap Up (1:20)
-
StartService Worker - FAQ
-
StartUseful Resources & Links
Course Prerequisites
Basic JavaScript knowledge is required
Basic HTML/ CSS knowledge helps
NO framework knowledge is required
All pre-requisites are covered by courses in our "Academind Pro" Membership.
Don't take my word for it - here's what other students are saying.
Richard Johnstone
So far the course is great! Maximilian has a very good teaching style, making the tutorials fun and interesting. Keeps you excited and wanting to learn more.
Ramakrishnan
Very well organised contents. All efforts are made to introduce to best practices and lot of motivation for learning. Keep it up.
Pankaj Sharma
Reminded me of old school days where you discuss every small aspect of a course. Maximilian explained everything especially why we are doing this not that, so that we can understand ever line of code we write. Highly recommended!!
30 Day Money Back Guarantee - No Questions Asked!
Our courses helped thousands of students learn something new and improve their lives.
We're so convinced by our course quality that we guarantee your success and provide a full refund within the first 30 days if you're not happy with the course.
Your Instructor
As a self-taught professional I really know the hard parts and the difficult topics when learning new or improving on already-known languages. This background and experience enable me to focus on the most relevant key concepts and topics. My track record of many 5-star rated courses, more than 2,500,000 students worldwide as well as a successful YouTube channel with 900.000 subscribers is the best proof for that.
The most rewarding experience for me is to see how people find new, better jobs, build awesome web applications, work on amazing projects or simply enjoy their hobby with the help of my content.
That's why, together with Manuel Lorenz, I founded Academind to offer the best possible learning experience and to share the pleasure of learning with our students.
Frequently Asked Questions
Join 9884 happy students!
Single-Course License
Full access to "Progressive Web Apps (PWA) - The Complete Guide"
$69
Access to this course only.
This is a one-time payment that grants access to this course only, not to any other courses.
Academind Pro Membership
Unlimited access to this and all other current & future courses!