# Use ipfs-http-client in reactjs to create local node in browser

**URL:** <https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152>\
**Category:** js-ipfs\
**Created:** [May 5, 2022, 10:51pm UTC](https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152 "2022-05-05T22:51:39Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Luex](https://avatars.discourse-cdn.com/v4/letter/l/eb8c5e/32.png) [@Luex](https://discuss.ipfs.tech/u/Luex)\
**Post date:** [May 5, 2022, 10:51pm UTC](https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152/1 "2022-05-05T22:51:39Z")

</div>

I am really desperate, because I want to instantiate a local node in my webapp created with reactjs. I tried installing ipfs-core using this documentation: [ipfs-core - npm](https://www.npmjs.com/package/ipfs-core?activeTab=readme) which didnt work for me. React was not able to find the package.  
Then I installed the “whole” ipfs package, which also didnt work (same error as above).  
I am able to use ipfs-http-client, but it doesnt let me create a local node:

```auto
var ipfsHttpClient = require('ipfs-http-client');

var ipfs = ipfsHttpClient.create();

ipfs.add("Test");

```

throws

`POST http://localhost:3001/api/v0/add?stream-channels=true&progress=false 404 (Not Found)`

I know i can us a public gateway as parameter inside the create() function and everything works fine. But I dont want to rely on public gateways in my app. I thought I found an answer in this post: [How to upload file to IPFS with only front-end](https://discuss.ipfs.tech/t/how-to-upload-file-to-ipfs-with-only-front-end/11277) but they also used ipfs-core.

My question: does anyone know how to create a local node in browser to store ipfs files using ipfs-http-client. Maybe someone also knows why using “ipfs-core” and “ipfs” package didnt work. Thanks for your help 🙂

EDIT:

I want users to be able to have the node in the browser but not IPFS installed.

---

<div class="post-metadata">

**Author:** ![unllamas](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.ipfs.tech/unllamas/32/6471_2.png) [@unllamas](https://discuss.ipfs.tech/u/unllamas)\
**Post date:** [May 8, 2022, 5:26pm UTC](https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152/2 "2022-05-08T17:26:33Z")

</div>

Hi!

Have you tried this example? [js-ipfs-examples/ipfs.js at master · ipfs-examples/js-ipfs-examples · GitHub](https://github.com/ipfs-examples/js-ipfs-examples/blob/master/examples/browser-nextjs/components/ipfs.js)

I’m using it like this in a context

 ![Screen Shot 2022-05-08 at 14.20.05](https://us1.discourse-cdn.com/flex020/uploads/ipfs1/original/2X/a/a74211b29b157c394ea8ab7617de24d008a4c976.png)

---

<div class="post-metadata">

**Author:** ![Luex](https://avatars.discourse-cdn.com/v4/letter/l/eb8c5e/32.png) [@Luex](https://discuss.ipfs.tech/u/Luex)\
**Post date:** [May 9, 2022, 9:07am UTC](https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152/3 "2022-05-09T09:07:19Z")

</div>

Which version of ipfs-core are you using? Because when I try to isntall ipfs-core via npm install ipfs-core@latest no module with the name ipfs-core is downloaded (only some other IPFS folders). Therefore I can’t import it via “import” statement.

---

<div class="post-metadata">

**Author:** ![unllamas](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.ipfs.tech/unllamas/32/6471_2.png) [@unllamas](https://discuss.ipfs.tech/u/unllamas)\
**Post date:** [May 10, 2022, 9:37pm UTC](https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152/4 "2022-05-10T21:37:15Z")

</div>

Any options works:

```auto
{
  "ipfs-core": "^0.14.0",
  "ipfs-http-client": "^56.0.0",
}

```

---

<div class="post-metadata">

**Author:** ![Luex](https://avatars.discourse-cdn.com/v4/letter/l/eb8c5e/32.png) [@Luex](https://discuss.ipfs.tech/u/Luex)\
**Post date:** [May 10, 2022, 9:48pm UTC](https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152/5 "2022-05-10T21:48:24Z")

</div>

Thanks for your help, I got it to work!  
Do you have experience with LockExistsError?  
I have set IPFS as a globale object and put it inside useEffect so it is called only once:

```auto
useEffect(() => {

    async function initIpfs(){

      try{

        process.on("SIGTERM", stop)

        process.on("SIGINT", stop)

        process.on("SIGHUP", stop)

        process.on("uncaughtException", stop)

        if(!global.IPFS){

          global.IPFS = await IPFS.create({ started: false, repo: ".jsipfs"});

          console.log(global);

          global.IPFS.stop();

        }

        return () => {

          stop();

        }

      }catch(error){

        console.log(error);

      }

    }

    initIpfs();

   

  }, [])

```

But I keep getting following error:

`LockExistsError: Lock already being held for file: .jsipfs/repo.lock`

Do you know where the folder “.jsipfs” is, so I can atleast delete the lock file or do you even know how to resolve the error?

---

<div class="post-metadata">

**Author:** ![unllamas](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.ipfs.tech/unllamas/32/6471_2.png) [@unllamas](https://discuss.ipfs.tech/u/unllamas)\
**Post date:** [May 10, 2022, 10:03pm UTC](https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152/6 "2022-05-10T22:03:43Z")

</div>

Great!

Have you read the following thread? [Js-ipfs broke error `Unhandled Rejection (LockExistsError): Lock already being held for file: ipfs/repo.lock`](https://discuss.ipfs.tech/t/js-ipfs-broke-error-unhandled-rejection-lockexistserror-lock-already-being-held-for-file-ipfs-repo-lock/11172)

Maybe find a solution

---

<div class="post-metadata">

**Author:** ![Luex](https://avatars.discourse-cdn.com/v4/letter/l/eb8c5e/32.png) [@Luex](https://discuss.ipfs.tech/u/Luex)\
**Post date:** [May 10, 2022, 10:05pm UTC](https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152/7 "2022-05-10T22:05:26Z")

</div>

Yes, I have 😃

I have read every single page but couldnt resolve my problem.  
Do you know where the folder is located in the file-system?

---

<div class="post-metadata">

**Author:** ![unllamas](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.ipfs.tech/unllamas/32/6471_2.png) [@unllamas](https://discuss.ipfs.tech/u/unllamas)\
**Post date:** [May 10, 2022, 10:14pm UTC](https://discuss.ipfs.tech/t/use-ipfs-http-client-in-reactjs-to-create-local-node-in-browser/14152/8 "2022-05-10T22:14:37Z")

</div>

I think the problem may be that you are trying to initialize a node already made

```auto
repo: ".jsipfs"

```

Try this way

```auto
global.IPFS = await IPFS.create({ repo: 'ok' + Math.random()});

```