<< Back << Firebase storage - upload image.

046 What is Firebase Storage Learn its Key Features
047 File Upload with AngularFire - Step by Step Implementation
048 Implementing a File Upload Percentage Indicator with Angular Material
049 Get a Firebase Storage Revocable Download Url
050 Firebase Storage Security Rules - File Upload Conclusion

• 1. Firebase Storage is ordinary file systems with URL on Googleapis.com
• 2. Deploy functions with storage rules.
• 3. Build modal dialog form. Use FormGroup and @Inject Mat-Dialog-data to code.
• 4. Use Html Input type="file" to upload and inject to Change property browser event $event. Processing $event.target on form.
• 5. Determine right filepath on storage with AngularFireStorage.
• 6. Storage upload return Task (this is observable variable). This task has Snapshot changes event. We need subscribe to that task.
• 7. Also upload task has percentage events (observable).
• 8. Use progress bar with parameters [value]=, create local variable on *ngif for that parameter.
• 9. Use Pipe(last) with observable event.
• 10. Receive link to DownloadURL.
• 11. Use Pipe(last), ConcatMap with DownloadURL.
• 12. Show Image based on Observable variable DownloadUrl.
• 13. Deploy function and set right to Firebase Storage for uploading.
• 14. Generate Thumbnail using ImageMagic module. Use rimraf modile to delete big image from storage bucket. Set right to delete.

< THANKS ME>