Skip to content
This repository has been archived by the owner on Feb 12, 2024. It is now read-only.

Commit

Permalink
docs: improve README of browser-create-react-app (#3737)
Browse files Browse the repository at this point in the history
Co-authored-by: kvutien <kvutien@VTKT5.fritz.box>
Co-authored-by: Alex Potsides <alex@achingbrain.net>
  • Loading branch information
3 people committed Jul 27, 2021
1 parent 8bcf56f commit 9852d14
Showing 1 changed file with 7 additions and 8 deletions.
15 changes: 7 additions & 8 deletions examples/browser-create-react-app/README.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
## IPFS React app

A minimal demonstration of how to use js-ipfs in a `create-react-app` generated app.
This is a minimal demonstration of how to use `js-ipfs` in a `create-react-app` generated app.

It boots up a js-ipfs instance (an IPFS node) via a custom React hook in `./src/hooks/use-ipfs-factory.js`, which is called from `./src/App.js`. Once the IPFS node is set up, `App.js` displays its ident and its version number.
It boots up a `js-ipfs` instance (an IPFS node) via a custom React hook in `./src/hooks/use-ipfs-factory.js`, which is called from `./src/App.js`. Once the IPFS node is set up, `./src/App.js` displays the [PeerId](https://docs.libp2p.io/concepts/peer-id/) of this node and the version number of `js-ipfs` used to spawn it.

> _Remember that a Peer ID of an IPFS node is [the multihash of the public key of this node](https://github.com/libp2p/specs/blob/master/peer-ids/peer-ids.md#peer-ids), and the public-private key pair of a node is generated by typing `ipfs init`._
> _Side note: The PeerId of the IPFS node is [the multihash of the public key of this node](https://github.com/libp2p/specs/blob/master/peer-ids/peer-ids.md#peer-ids). The public-private key pair of a node is generated by typing `ipfs init`._
![Screen shot of the js ipfs node id info](./images/screenshot.png)

Expand All @@ -23,14 +23,14 @@ $ npm start
```
## Call structure in `App.js`
All React applications store their main logic in `App.js`:
* `App.js` renders the cosmetics of the demo and call `useIpfs` to retrieve the `id` of the node
* `App.js` renders the cosmetics of the demo and calls `useIpfs` to retrieve the `id` of the node
* `useIpfsFactory.js` initialises and closes the IPFS local node
* `useIpfs.js` does the actual calls to IPFS to retrieve the property specified in argument (here the retrieved property is `id`, requested from `App.js`)

## Annexes
### Console message `[HMR] Waiting for update signal from WDS...`
### You may be puzzled by a console message `[HMR] Waiting for update signal from WDS...`

This message comes from the hot reload capability of webpack, that can update the web app every time you save your development code. To remove it, see here: https://stackoverflow.com/questions/59695102/reactjs-console-error-hmr-waiting-for-update-signal-from-wds
This message comes from the hot reload capability of `webpack`, that can update the web app every time you save your development code. To remove it, see here: https://stackoverflow.com/questions/59695102/reactjs-console-error-hmr-waiting-for-update-signal-from-wds

### Available Scripts from create-react-app

Expand Down Expand Up @@ -64,5 +64,4 @@ But with modern hosting services like Heroku, Netlity or Fleek, you can skip the

You can learn more on IPFS API in the [IPFS documentation](https://docs.ipfs.io/) and [IPFS npm documentation](https://www.npmjs.com/package/ipfs-http-client).

Details how to use the File System abstraction of IPFS (add, cat, egt, ls etc.) are [here](https://github.com/ipfs/js-ipfs/blob/master/docs/core-api/FILES.md)

Details how to use the File System abstraction of IPFS (add, cat, get, ls etc.) are [here](https://github.com/ipfs/js-ipfs/blob/master/docs/core-api/FILES.md)

0 comments on commit 9852d14

Please sign in to comment.