In this tutorial, I will show you way to build an Angular 11 File upload example using Bootstrap, FormData and Progress Bar.

Full Article:


We're gonna create an Angular 11 File upload application in that user can:
  • see the upload process (percentage)
  • view all uploaded files
  • download by clicking on the file name


  • Angular 11
  • RxJS 6
  • Bootstrap 4

Web API for File Upload & Storage

Here is the API that our Angular App will work with:
Methods Urls Actions
POST /upload upload a File
GET /files get List of Files (name & url)
GET /files/[filename] download a File

You can find how to implement the Rest APIs Server at one of following posts:

For more details, implementation and Github, please visit:

#angular #web-development #javascript #node #express #bootstrap

Angular 11 File upload example with progress bar
30.20 GEEK