DAPP是Decentralized Application的缩写，即去中心化应用，也有人称为分布式应用。它被认为开启了区块链3.0时代。
智能合约有哪些特点？
与传统的合约相比，智能合约有三大特点：
1、合约内容公开透明
智能合约部署在区块链上，其合约内容自然是公开透明的。
2、合约内容不可篡改
同样，因为部署在区块链上原因，智能合约的内容是无法被修改的。
3、永久运行
运行在区块链上的智能合约，同样被区块链上网络节点共同维护，只要区块链在，智能合约就能永久的运行下去。
准备Uniswap合约源码
源码结构
Uniswap在Github上面开源了全部合约代码,其中包括核心合约,周边合约两部分.Uniswap还开源了前端代码,前端代码使用React开发
在Uniswap的核心代码中,主要包含3个合约:工厂合约,配对合约,ERC20合约.其中配对合约继承了ERC20合约,我们可以把它们看作一个合约.工厂合约通过create2方法部署配对合约,所以在部署合约时只需要部署工厂合约.
周边合约中包括一些示例代码,例如价格预言机,闪电交换,其中最重要的是路由合约.在周边合约的代码库中,包含两个路由合约:UnsiwapV2Router01,UnsiwapV2Router02.工厂合约和配对合约需要通过路由合约调用才能更好的完成交易所的全部功能,所以我们还要部署路由合约
准备部署账户
Uniswap的路由合约部署在以太坊的主网和Ropsten,Rinkeby,Goerli,Kovan几个测试网的合约地址都是相同的,这样可以使Uniswap的前端不管切换到任何一个网络,路由地址都不会变.要想实现这个相同地址的部署,我们需要准备一个全新的账户用来部署合约.全新的账户指的是在部署合约之前的nonce值为0.因为合约的地址是根据你的账户地址和nonce值计算出来的,所以在不同网络中,如果nonce值相同,部署出的合约地址也相同.
准备WETH合约地址
在部署路由合约时,构造函数中需要填入工厂合约的地址和WETH合约的地址,由于WETH合约的地址在主网和测试网的地址都不相同,所以需要找到每个网络中WETH合约的地址.
申请infuraKey
在部署合约之前,我们还需要使用infura作为免费节点,所以需要申请一个infuraKey
使用remix部署合约
将工厂合约和路由合约的线上版本导入到remix中,在编译合约的选项中,EVM VERSION选择istanbul,COMPILER CONFIGURATION中选择Enable optimization
部署顺序和构造函数
部署工厂合约
构造函数的参数是一个自己常用的账户地址
部署路由合约01[可选],02
构造函数的参数1是工厂合约的地址
参数2是当前网络中WETH合约的地址,
部署Uniswap前端
克隆前端代码
在项目目录运行命令:
$git clone https://github.com/Uniswap/uniswap-interface.git
安装依赖库
在项目目录运行命令:
$cd uniswap-interface
$yarn
安装完成后,可以先测试运行一下,在uniswap-interface目录运行命令
$yarn start
如果运行成功,将会打开一个浏览器,同时打开Uniswap的前端界面
修改路由地址
在Uniswap的前端中以常量的形式定义了Uniswap的路由地址,我们只需要修改路由地址就可以让前端链接到你的路由合约中
修改文件:项目目录/uniswap-interface/src/constants/index.ts第6行
import{AbstractConnector}from'web3-react/abstract-connector'
import{ChainId,JSBI,Percent,Token,WETH}from'uniswap/sdk'
import{fortmatic,injected,portis,walletconnect,walletlink}from'../connectors'
export const ROUTER_ADDRESS='0x7a250d5630B4cF539739dF2C5dAcb4c659F2488D'//修改成你的路由合约地址
......
保存后运行yarn start即可看到效果
将代码部署到GitHub Pages
创建GitHub项目
创建项目的方法就不在这里讲了,不会的同学可以去搜索一下
将前端代码添加到GitHub项目仓库
首先要删除原先Uniswap项目中的.git目录,在项目目录运行命令:
$cd uniswap-interface
$rm-rf.git
然后初始化git,并将Unsiwap前端代码添加到自己的项目仓库中
git init
git remote add origin https://github.com/用户名/项目名.git
安装并部署gh-pages
我们将通过gh-pages模块将前端代码部署到github.io,在前端代码的目录运行:
$yarn add gh-pages
接下来要编译react和部署gh-pages,在前端代码的目录运行:
$yarn build
修改前端代码目录中的package.json
$vim package.json
{
"name":"uniswap/interface",
"description":"Uniswap Interface",
"homepage":"https://用户名.github.io/项目名称",//修改这里
......
//添加部署的脚本,还是在package.json中
......
"scripts":{
......
"deploy":"gh-pages-d build"//添加这一行
},
保存退出之后,在前端代码的目录运行:
$git add.
$git commit-m"first commit"
$git push
$yarn deploy
现在在浏览器中打开https://用户名.github.io/项目名称/index.html就可以打开自己的交易所啦.
如果不输入地址结尾的index.html在项目刚部署之后会报错,过一段时间就可以不输入了.
