Course Information
Course Overview
Create a Beautiful Instagram-Style Progressive Web App with Vue 2, Quasar V1, Firebase, NodeJS & Express
In this course, I'm gonna show you how to use Quasar Framework V1, Vue JS 2 and Firebase to create an amazing Progressive Web App (PWA).
We're gonna create a gorgeous Instagram clone called Quasagram.
In this app we can display a list of posts; each post has an image, location, caption and the date the image was taken.
We can access the user's camera and take a photo, enter a caption, find the user's location and create a new post.
It's gonna have a beautiful responsive design that adapts across Desktop & Mobile.
We're gonna store all our data in a Firebase Cloud Firestore database.
We'll store our photos in Firebase Storage.
We're gonna create our own NodeJS & Express backend with several different endpoints for interacting with the database.
We'll incorporate all of the 5 Core PWA features:
Home Screen Installation
Precaching
Caching Strategies
Background Sync
Push Notifications
We'll get the app working on iOS, Android & all the main desktop browsers, and it'll even fall back gracefully for older browsers like Internet Explorer.
You'll also learn about Service Workers, Workbox, Firebase Cloud Firestore database, Firebase Storage, NodeJS & Express and much more.
By the end of this course, you'll be able to create your own Progressive Web Apps using Vue JS, Quasar Framework, Firebase, NodeJS & Express.
NOTE: This course is for Quasar V1 (with Vue 2). Quasar V2 (with Vue 3) is not covered in this course.
Course Content
- 10 section(s)
- 239 lecture(s)
- Section 1 Introduction
- Section 2 Getting Started
- Section 3 Layout, Pages & Routes - Start building Quasagram
- Section 4 Design - Home Page
- Section 5 Design - Camera Page
- Section 6 Native Device Features - Camera
- Section 7 Native Device Features - Location
- Section 8 Firebase - Cloud Firestore Database & Storage
- Section 9 Node.js & Express Backend
- Section 10 Get Posts Endpoint
What You’ll Learn
- How to create a beautiful Instagram clone PWA with Vue JS, Quasar & Firebase
- How to integrate the 5 Core PWA Features: Home Screen Installation, Precaching, Caching Strategies, Background Sync & Push Notifications
- How to make a PWA fully functional offline
- How to create a gorgeous responsive design that adapts across Mobile & Desktop
- How to access the device's Native Camera & Location
- All about Service Workers, Workbox, Firebase Cloud Firestore, Firebase Storage, NodeJS & Express and much more
Reviews
-
SStefano Somenzi
If you are looking for a training course that will guide step by step in learning how to leverage quasar and firebase to build your web and mobile app, this is it. Danny has done an exceptional work building this course. Bravo!
-
KKhadimhusen
Very Well Explained.It would be better if it is upgraded of quasar v2 and vue3 version.
-
RRobert Zheng
Danny as the Instructor has a good voice, it's easy for non-native english speaker to understand him. The course itself is well structured and Danny explain everything around, but at least some basic Vue knowledge is usefull. Also the "quasargram" example app is a nice idea where you can learn a lot of usefull stuff.
-
DDanilo Babovic
This is currently the best PWA course and saved me months in research. Danny, thanks for the extra effort. Best