https://github.com/benwinding/mat-firebase-upload

An easy to use upload dropzone for Angular/Firebase.
https://github.com/benwinding/mat-firebase-upload

angular cloud-storage firebase mat-firebase-upload material-design

Last synced: about 1 month ago
JSON representation

An easy to use upload dropzone for Angular/Firebase.

• Host: GitHub
• URL: https://github.com/benwinding/mat-firebase-upload
• Owner: benwinding
• Created: 2019-08-16T06:04:15.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2021-04-22T00:12:52.000Z (about 5 years ago)
• Last Synced: 2025-03-07T00:36:09.857Z (over 1 year ago)
• Topics: angular, cloud-storage, firebase, mat-firebase-upload, material-design
• Language: TypeScript
• Homepage: https://benwinding.github.io/mat-firebase-upload/
• Size: 15.9 MB
• Stars: 1
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# mat-firebase-upload

[![NPM Version](https://img.shields.io/npm/v/mat-firebase-upload.svg)](https://www.npmjs.com/package/mat-firebase-upload) 

[![License](https://img.shields.io/npm/l/mat-firebase-upload.svg)](https://github.com/benwinding/mat-firebase-upload/blob/master/LICENSE) 

[![Downloads/week](https://img.shields.io/npm/dm/mat-firebase-upload.svg)](https://www.npmjs.com/package/mat-firebase-upload) 

[![Github Issues](https://img.shields.io/github/issues/benwinding/mat-firebase-upload.svg)](https://github.com/benwinding/mat-firebase-upload)

An easy to use upload dropzone.



- Angular 2+

- Material themed

- Firebase storage

## Basic Example

_Component HTML_

``` html

```

_Component Typescript_

``` ts

...

  controlFile = new FormControl();

  config = {

    directory: `path/to/upload/to`,

    firebaseConfig: environment.firebaseConfig,

  };

...

```

_angular.json_

``` json

"my-project": {

  ...,

  "architect": {

    "build": {

      ...,

      "options": {

        ...,

        "assets": [

          ...,

          {

            "glob": "**/*",

            "input": "node_modules/mat-firebase-upload/assets",

            "output": "./assets/fileicons"

          }

```

## Advanced Options

_Component HTML_

``` html

```

_Component Typescript_

``` ts

...

  controlFile = new FormControl();

  config: FormFirebaseFilesConfiguration = {

    directory: `audits/somelocation`,

    firebaseConfig: environment.firebaseConfig,

    bucketname: 'my-other-bucket-name.appspot.com',

    firebaseApp: app,

    imageCompressionQuality: 0.8,

    imageCompressionMaxSize: 2000,

    acceptedFiles: 'image/*',

    useUuidName: true,

    deleteOnStorage: true

  };

...

```

More details in the [Type definitions](https://github.com/benwinding/mat-firebase-upload)!