当前位置: 代码迷 >> 综合 >> 使用React前端框架结合js-ipfs-api实现IPFS的文本数据流传输
  详细解决方案

使用React前端框架结合js-ipfs-api实现IPFS的文本数据流传输

热度:91   发布时间:2023-12-13 05:04:54.0

本文我们将通过React这个js前端框架来实现一个简易的页面,通过官方提供的js-ipfs-api,我们可以在页面的文本框中输入任意文本,然后提交上传到IPFS节点网络中,再利用hash参数把上传的文本数据显示出来。

React简介及安装

React是由Facebook和Instagram来开发的一种用来创建用户界面的JavaScript库。

React的简单入门见https://reactjs.org/tutorial/tutorial.html

首先你要保证电脑上已经安装了Node.js的最近版本,然后可以根据安装教程来创建新项目。

npm install -g create-react-app
sily@lyg-sily:~$ npm install -g create-react-app
/home/sily/.nvm/nvm/versions/node/v9.3.0/bin/create-react-app -> /home/sily/.nvm/nvm/versions/node/v9.3.0/lib/node_modules/create-react-app/index.js
+ create-react-app@1.5.2
added 114 packages in 26.067s
sily@lyg-sily:~$ create-react-app --version
1.5.2
React项目创建
sily@lyg-sily:~$ create-react-app ipfs-demoCreating a new React app in /home/sily/ipfs-demo.Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...> uglifyjs-webpack-plugin@0.4.6 postinstall /home/sily/ipfs-demo/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js+ react-scripts@1.1.1
+ react@16.2.0
+ react-dom@16.2.0
added 1155 packages in 131.72sSuccess! Created ipfs-demo at /home/sily/ipfs-demo
Inside that directory, you can run several commands:npm startStarts the development server.npm run buildBundles the app into static files for production.npm testStarts the test runner.npm run ejectRemoves this tool and copies build dependencies, configuration filesand scripts into the app directory. If you do this, you can’t go back!We suggest that you begin by typing:cd ipfs-demonpm startHappy hacking
  相关解决方案