Skip to content
This repository was archived by the owner on Mar 10, 2020. It is now read-only.

docs: update example of browserify #429

Merged
merged 1 commit into from
Nov 17, 2016
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
node_modules
*.log
**/node_modules
**/*.log
test/setup/tmp-disposable-nodes-addrs.json
dist
coverage
2 changes: 2 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,8 @@ var ipfs = ipfsAPI({host: 'localhost', port: '5001', procotol: 'http'})

Same as in Node.js, you just have to [browserify](http://browserify.org) the code before serving it. See the browserify repo for how to do that.

See the example at the [examples folder](/examples/bundle-browserify) to get a boilerplate.

### In a web browser from CDN

Instead of a local installation (and browserification) you may request a remote copy of IPFS API from [unpkg CDN](https://unpkg.com/).
Expand Down
18 changes: 0 additions & 18 deletions examples/browser-add/README.md

This file was deleted.

35 changes: 35 additions & 0 deletions examples/bundle-browserify/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
# Bundle js-ipfs-api with Browserify!

> In this example, you will find a boilerplate you can use to guide yourself into bundling js-ipfs-api with browserify, so that you can use it in your own web app!

## Setup

As for any js-ipfs-api example, **you need a running IPFS daemon**, you learn how to do that here:

- [Spawn a go-ipfs daemon](https://ipfs.io/docs/getting-started/)
- [Spawn a js-ipfs daemon](https://github.com/ipfs/js-ipfs#usage)

**Note:** If you load your app from a different domain than the one the daemon is running (most probably), you will need to set up CORS, see https://github.com/ipfs/js-ipfs-api#cors to learn how to do that.

A quick (and dirty way to get it done) is:

```bash
> ipfs config --json API.HTTPHeaders.Access-Control-Allow-Origin "[\"*\"]"
> ipfs config --json API.HTTPHeaders.Access-Control-Allow-Credentials "[\"true\"]"
```

## Run this example

Once the daemon is on, run the following commands within this folder:

```bash
> npm install
> npm start
```

Now open your browser at `http://localhost:8888`

You should see the following:

![](https://ipfs.io/ipfs/QmNtpcWCEd6LjdPNfBFDaVZdD4jpgT8ZTAwoFJXKhYMJdo/1.png)
![](https://ipfs.io/ipfs/QmNtpcWCEd6LjdPNfBFDaVZdD4jpgT8ZTAwoFJXKhYMJdo/2.png)
Binary file added examples/bundle-browserify/img/1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added examples/bundle-browserify/img/2.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,10 @@
</style>
</head>
<body>
<h1>JS IPFS API - Add file from the browser</h1>
<h1>JS IPFS API - Add data to IPFS from the browser</h1>
<textarea id="source">
</textarea>
<button id="store">create in ipfs</button>
<button id="store">add to ipfs</button>
<div>
<div>found in ipfs:</div>
<div class="content" id="hash">[ipfs hash]</div>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
'use strict'

var IPFS = require('../../src')
var IPFS = require('ipfs-api')

var ipfs = IPFS()

function store () {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "ipfs-api-example-browser-add",
"name": "bundle-browserify",
"version": "1.0.0",
"description": "",
"description": "Bundle js-ipfs-api with Browserify",
"main": "index.js",
"scripts": {
"start": "browserify index.js > bundle.js && http-server -a 127.0.0.1 -p 8888"
Expand All @@ -10,7 +10,10 @@
"author": "Friedel Ziegelmayer",
"license": "MIT",
"devDependencies": {
"browserify": "^13.0.1",
"browserify": "^13.1.1",
"ipfs-api": "^11.1.0",
"http-server": "^0.9.0"
},
"dependencies": {
Copy link
Contributor

@victorb victorb Nov 17, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should be a devDependency since it's included on build

}
}
File renamed without changes.