企业电商网站商城建设上海企业seo
前言
在DApp实战篇：先用前端起个项目一文中我们起了一个前端项目，在后续开发中笔者将带领大家一步步完成这个DAPP，为了方便后续讲解，本篇将完整说明后续我们要进行的开发和思路。
主打前端
实际上一个完整的DAPP是由前端和智能合约组成的（探秘区块链开发：智能合约在 DApp 中的地位及与传统开发差异），但是为了照顾初学者，笔者先主要讲解前端篇，而智能合约我们则选择以太坊公链上现成的合约，例如USDT合约。
而我们要完成的功能如下：
一.输入用户地址进行余额查询
该小节分为两步：
1.使用ethers.js和web3.js连接合约
前端和区块链通信是需要通过智能合约的，因此DAPP的前端开发中第一步应该是要知道如何连接合约。
而为了让大家了解web3js和ethersjs两者的区别，我将都讲解一次。
2.输入地址并调用合约读方法
连接完合约之后我们可以写一个输入框输入用户地址调用一下智能合约中的读方法进行余额查询，至于什么是读写方法可查看：深入讲解：智能合约中的读写方法
二.连接我们自己的钱包查询余额
连接钱包是DAPP交互中最为重要的一步，至于为什么可以查看：DApp中的区块链钱包为什么重要
1.使用ethers.js和web3.js手搓一个钱包连接
其实市面上已经有很多集成了各种钱包的连接库，而且笔者在实际开发中也基本上是使用现成的连接库，但是为了照顾初学者，还是需要知道如何不用库的情况下完成钱包连接，这里我们选择使用metamask。
2.使用appkit完成钱包连接
APPKIT是一个强大的web3套件，它包含了web3登录、钱包连接等等功能。
三.输入地址进行转账
上述小节只是完成了最基础的操作，如何将数据写入区块链中，才是DAPP开发中最为重要的一环，因此该小节笔者将带领大家完成一个输入地址之后转账的功能。即便仅仅只调用了一个写方法，但实际上大多数写方法调用的方式都是一样的。
本系列目录
-
DApp实战篇：前端技术栈一览
-
DApp实战篇：先用前端起个项目