https://github.com/whitetigle/fable-uploadcare

Upload care widget testing
https://github.com/whitetigle/fable-uploadcare

fable fsharp react uploadcare

Last synced: about 1 month ago
JSON representation

Upload care widget testing

• Host: GitHub
• URL: https://github.com/whitetigle/fable-uploadcare
• Owner: whitetigle
• Created: 2018-05-02T15:52:59.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2018-05-03T08:58:48.000Z (over 6 years ago)
• Last Synced: 2024-11-17T00:33:37.984Z (about 1 month ago)
• Topics: fable, fsharp, react, uploadcare
• Language: JavaScript
• Homepage: https://whitetigle.github.io/fable-uploadcare/.
• Size: 777 KB
• Stars: 4
• Watchers: 2
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Fable UploadCare Widget

Try it: click [here](https://whitetigle.github.io/fable-uploadcare/)

## Building and running the app

> In the commands below, yarn is the tool of choice. If you want to use npm, just replace `yarn` by `npm` in the commands.

* `cd UploadCare`

* Install dependencies: `yarn`

* Start Fable daemon and [Webpack](https://webpack.js.org/) dev server: `yarn start`

* In your browser, open: http://localhost:8084/

## How to use in your project

* Add dependency: `yarn add uploadcare-widget`

* Grab the `src/UploadCarecomponent.fs` file and add it to your project.

## How does it work?

### Prepare a component helper

 ```f#

  let inline UploadCare props = ofType props []

```

### Use it in your React view

```f#

 UploadCare  

    { 

        value=""

        onChange=(fun _ -> printfn "onChange")

        onUploadComplete=(fun info -> printfn "%s" info.cdnUrl)

    }

```

### Update your index.html with credentials

```html

  UPLOADCARE_PUBLIC_KEY = 'demopublickey'; // change to your private key

```

### Use it with Elmish

Just have a look at `src/App.fs` to see a complete sample

## Disclaimer

> The whole UploadCare API has not been handled in this project. It's merely a simple sample you can then change according to your needs.

> So fork this project or send a PR if you wish to add more bindings.

## Credits

Thanks to @vbfox for his great [React to fable tutorials](https://blog.vbfox.net/2018/02/06/fable-react-1-react-in-fable-land.html)!