Example: Upload file to IPFS via browser w/ React & Webpack

[harlantwood]

TL;DR: A new example, showing uploading a binary file to IPFS via the browser using js-ipfs-api, via a simple React app, bundled with Webpack.

Issues have been fixed, ready to merge. Works in (my) Chrome and Firefox on Mac.

From the readme of this example:

After uploading a file (left screen), and opening the uploaded file (right screen), you should see something like:

For more background see #316.

@diasdavid @dignifiedquire @lidel

[harlantwood]

Weird... this was working last night, but now fails in the browser with this error:

Got nowhere googling it... any ideas? @dignifiedquire perhaps?

[daviddias]

@harlantwood, just to remove weird chances, mind trying a fresh npm install and run through it again?

[harlantwood]

I did try that, but thanks! Any other ideas welcome. Strange.

[harlantwood]

Weird, fixed the issues above... by removing the eslint dependencies. No idea why. But works.

Someone give it a try to confirm it works on 2 machines. 😉

Other than that, ready for merging AFAICT.

[harlantwood]

Note: this was originally forked from @victorbjelkholm's bundle-webpack example, which was a great head start.

[daviddias]

Looks like an awesome example, thank you @harlantwood

Seems CI fails just because of linting, mind running a npm run lint and checking what is wrong?

Thank you :)

[daviddias]

Do we need this file?

[harlantwood]

well, we need a bit of lint config so that aegir doesn't get upset about react/jsx stuff. I simplified by replacing this one with the .eslintrc from examples/bundle-webpack.

[daviddias]

Do we need this?

[harlantwood]

seems like not. I cut it out and it all seems to hang together ok. 😜

[harlantwood]

Thanks @diasdavid. I fixed the lint issues.

FWIW, I looked at travis and saw that the build hadn't passed in a month, so I ignored the failing builds there without investigating, especially because Circle CI was passing. Not sure what the deal is there. Maybe we should lint on Circle as well?

Also @dignifiedquire aegir-lint was failing because I was trying to use the futuristic not yet allowed at all http://babeljs.io/docs/plugins/transform-class-properties/ -- it got a "parse error". The thing I wanted to bring to your attention is that aegir-lint gave no information on CI, just "exit code 1" ( https://travis-ci.org/ipfs/js-ipfs-api/jobs/213967377 ) although it gave a clear error message when I ran npm lint locally.

[dignifiedquire]

Thanks @harlantwood there are some issues with output in awgir currently which will hopefully be fixed soonish. Not sure why we don't run linting circle we should fix that.

[daviddias]

build hadn't passed in a month

I believe that isn't quite right, as the only run that 'typically' fails is the Node.js 6 because we run the SauceLabs tests there, which has a super short pool of workers and returns failure if there aren't any available. We need to use better those small resources available.

aegir-lint gave no information on CI

We are currently looking for help into refactoring aegir -- ipfs/aegir#113 -- These kind of problems are causing a lot of trouble, if you or if you know anyone that would like to help, please ping us :).

Thank you!

[harlantwood]

Great, glad to get this example in! 😁