Skip to content

AnkitMaheshwariIn/IonicPWA-WithFirestoreCRUD-WithFirebaseStorageUpload

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Ionic PWA (Angular) | with Firestore CRUD & Advance where Queries | with Firebase Storage Upload.

(Progressive Web App Demo - built using Ionic PWA and Angular.)

This application (GitHub code) is a Demo version of following tutorials:

#1 How to build PWAs (Progressive Web Apps) using Angular, Ionic4/Ionic Framework and Firebase Hosting. Link to tutorial: https://www.codewithchintan.com/how-to-build-pwa-progressive-web-app-using-angular-ionic4-ionic-framework-and-firebase-hosting/

#2 Routing of an Angular Component | Angular Routing. Link to tutorial: https://www.codewithchintan.com/angular-routing/

#3 Steps to setup Firebase | Create New Database in Firebase Firestore by web. Link to tutorial: https://www.codewithchintan.com/steps-to-setup-firebase-create-new-database-in-firebase-firestore-by-web/

#4 How to do CRUD operations in Firebase with Firestore. Link to tutorial: https://www.codewithchintan.com/crud-in-firebase-with-firestore/

#5 How to upload and display image file in PWA/Angular project using Firebase-Cloud-Storage and AngularFire. Link to tutorial: https://www.codewithchintan.com/how-to-upload-and-display-image-file-in-pwa-angular-project-using-firebase-cloud-storage-and-angularfire/

#6 Deploy project to Firebase Hosting. Link to tutorial: https://www.codewithchintan.com/deploy-project-to-firebase-hosting/

#7 In Angular: Use Async-Pipe to manage Observable Subscriptions and Prevent Memory Leaks. Link to tutorial: https://www.codewithchintan.com/angular-async-pipe/

CHECK DEMO (Hosting URL): https://pwachitchat.firebaseapp.com

DO NOT FORGET to replace Firebase Configuration with yours in your environment.ts files:

  • (for local 👉) YOUR-PROJECT-DIRECTORY/src/environments/environment.ts
  • (for production 👉) YOUR-PROJECT-DIRECTORY/src/environments/environment.prod.ts